Nieuw lid |
|
Ik heb een menu balk kunnen ineensteken en deze is inorde. Alleen zou ik nu graag die kunnen laten uitrollen om meerdere menu-navigaties te kunnen verwezelijken. Weet iemand hoe dit moet ? Zoja, ook op mijn menubalk?
Mijn CSS:
#tabs5 {
background:#CECEE1;
line-height:normal;
font-size: 1.8em;
padding: 5px 5px 5px 5px;
border: 1px solid #595999;
margin: 10px 0px 10px 0px;
height:30px;
}
#tabs5 ul {
margin:0;
padding:0px 5px 0px 0px;
list-style:none;
}
#tabs5 li {
display:inline;
margin:0;
padding:0;
}
#tabs5 a {
float:left;
background:url("/img/tableft5.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabs5 a span {
float:left;
display:block;
background:url("/img/tabright5.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs5 a span {float:none;}
/* End IE5-Mac hack */
#tabs5 a:hover span {
color:#FFF;
}
#tabs5 a:hover {
background-position:0% -42px;
}
#tabs5 a:hover span {
background-position:100% -42px;
}
#tabs5 #current a {
background-position:0% -42px;
}
#tabs5 #current a span {
background-position:100% -42px;
}
#tabs5 { background:#CECEE1; line-height:normal; font-size: 1.8em; padding: 5px 5px 5px 5px; border: 1px solid #595999; margin: 10px 0px 10px 0px; height:30px; } #tabs5 ul { margin:0; padding:0px 5px 0px 0px; list-style:none; } #tabs5 li { display:inline; margin:0; padding:0; } #tabs5 a { float:left; background:url("/img/tableft5.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs5 a span { float:left; display:block; background:url("/img/tabright5.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs5 a span {float:none;} /* End IE5-Mac hack */ #tabs5 a:hover span { color:#FFF; } #tabs5 a:hover { background-position:0% -42px; } #tabs5 a:hover span { background-position:100% -42px; } #tabs5 #current a { background-position:0% -42px; } #tabs5 #current a span { background-position:100% -42px; }
Mijn html:
<div id="tabs5">
<ul>
<!-- CSS Tabs -->
<li><a href="index.php"><span>Agenda</span></a></li>
<li><a href="wiezijnwe.php"><span>Wie zijn we?</span></a></li>
<li><a href="takken.php"><span>Takken</span></a></li>
<li><a href="krochtje.php"><span>Krochtje</span></a></li>
<li><a href="fotos.php"><span>Foto's</span></a></li>
<li><a href="contact.php"><span>Contact</span></a></li>
<li><a href="forum2"><span>Forum</span></a></li>
<li><a href="links.php"><span>Links</span></a></li>
</ul>
</div>
Citaat: Sliphead Edit: Code tags gebruiken!!
|