Menü kódja
 

<div class="blue">
    <div id="waxcontainer">
        <div id="waxnav">
            <ul>
                <li>
                    <a class="current" href="/"><span>Főoldal</span></a>
                </li>
                <li>
                    <a href="/"><span>Kellékek</span></a>
                </li>
                <li>
                    <a href="/"><span>Kódok</span></a>
                </li>
                <li>
                    <a href="/"><span>Galéria</span></a>
                </li>
                <li>
                    <a href="http://users2.smartgb.com/g/g.php?a=s&amp;i=g24-02933-45" target="_blank"><span>Vendégkönyv</span></a>
                </li>
            </ul>
        </div>
    </div>
</div>

CSS kód
 

<style type="text/css">
.blue #waxcontainer{
   position:relative;
   height:48px; /* menü alja vastagsága, jelenleg kék. */
   background:#69BEEE; /* menü alja háttérszíne */
   width:100%;
   font-family:"Trebuchet MS",Arial,Verdana,Helvitica,sans-serif;
}
.blue #waxnav{
   position:relative;
   height:25px;
   font-size:11px;
   font-weight:bold;
   background:#fff repeat-x bottom left;
}
.blue #waxnav ul{
   margin:0px;
   padding:0 0 4px 0;
   list-style-type:none;
   width:400px;
   float:left;
}
.blue #waxnav ul li{
   display:block;
   float:left;
   margin:0 1px;
}
.blue #waxnav ul li a{
   display:block;
   float:left;
   color:#003858;
   text-decoration:none;
   padding:0 0 0 12px;
   height:21px;
   line-height:195%;
}
.blue #waxnav ul li a span{
   padding:0 12px 0 0;
}
.blue #waxnav ul li a:hover,.blue #waxnav ul li a.current{
   color:#fff;
   background:#1D6893 no-repeat top left;
}
.blue #waxnav ul li a:hover span,.blue #waxnav ul li a.current span{
   display:block;
   width:auto;
   background:#1D6893 no-repeat top right;
}
--></style>

3 135 megtekintés