aktiv side..

hej. jeg er igang med at slice et design for en ven og sætte det op i css/html.
Men jeg er løbet lidt ind i et problem.
Det jeg skal have lavet er at når f.eks. man er på forside så har linket forside et rødt faneblad bag sig.
jeg har 2 billedere. 1 hvor det bare står helt normalt at der er forside. og så et hvor den røde faneblad er med hvor teksten også er rykket ned.
Jeg vil have sådan at når jeg går ind på siden (index.html) så er det røde der allerede nede fra start af, da forside og index er det samme :)
- og så lige et sidste. Hvordan får jeg sådan at det røde ligger ovenover noget andet, da den faktisk er større i højden end den normale :).
håber virkelig der er nogen der kan hjælpe mig..
hvisi  i skulle finde andre ting som kan gøres bedre. så sig endelig til :)

<:html:>
<div id="wrapper">

    <div id="wrapspacing">
    </div>
    <div id="menu">
    <a href="index.html" id="index" onmouseover="mopen('index_a')" onmouseout="mouseOut()";><img src="images/forside.png" border= "0" name"index_a"></a>
    <a href="produkter.html" id="produkter"></a>
    <a href="butikken.html" id="butikken"></a>
    <a href="referencer.html" id="referencer"></a>
    <a href="kontakt.html" id="kontakt"></a>
    </div>
    <div id="menuspacing">
    </div>
    <div id="top">
    </div>

<:/html:>


<:css:>
#wrapper {
    left: 50%;
    margin-left: -398px;
    position: absolute;
    width: 796px;


}
#wrapspacing {
    float: left;
    width: 17px;
    height: 213px;

}

#menu {
        float: left;
        background-image: url("../images/menu.png"); 
        width: 779px;
        height: 38px;
    z-index:1;
}
#index {
    float: left;
   
    width:99px;
    height: 38px;
    margin-left: 15px;
    z-index:1;
}
#produkter {
    float: left;
    background-image: url("../images/produkter.png");
    width: 99px;
    height: 38px;
    margin-left:11px;
    z-index:1;
}
#butikken {
    float: left;
    background-image: url("../images/butikken.png");
    width: 99px;
    height: 38px;
    margin-left:18px;
    z-index:1;

}
#referencer {
    float: left;
    background-image: url("../images/referencer.png");
    width: 99px;
    height: 38px;
    margin-left:17px;
    z-index:1;
}
#kontakt {
    float: left;
    background-image: url("../images/referencer.png");
    width: 99px;
    height: 38px;
    margin-left:17px;
    z-index:1;
}

#menuspacing {
    float: left;
    width: 779px;
    height: 2px;

}

#top {
        float: left;
        background-image: url("../images/top.png");
        width: 779px;
        height: 166px;
}