...

View Full Version : How do i add a second level to this menu?! :(



ajr901
10-25-2010, 05:26 AM
I found this menu bar over at http://simplebits.com/notebook/2003/06/07/mini-tabs-the-un-tab-tab/ and i like it a lot and the page doesnt give too much information on it. I would like to add a second level so that when you hover over one of the tabs such as "cheddar" it gives a little drop down box with two more tabs. I've been fighting with it for hours and i just cant seem to figure it out. Someone please show me what to do. A couple of lines down im going to paste the CSS and HTML code being used for the menu itself.


@charset "utf-8";
/* CSS Document */

h3 {
font-size: 130%;
}

.container {
}

#minitabs {
margin-left: 5%;
padding: 0 0 20px 10px;
}

#minitabs li {
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}

#minitabs a:link, #minitabs a:visited {
float: left;
font-size: 15px;
font-family: "MS Serif", "New York", serif;
line-height: 14px;
font-weight: bold;
margin: 0px 10px 4px 10px;
padding-bottom: 2px;
text-decoration: none;
color: #69a90e;
}

#minitabs a.active:link, #minitabs a.active:visited, #minitabs a:hover {
border-bottom: 4px solid #69a90e;
padding-bottom: 2px;
color: #0065c3;
}




<div class="container">

<ul id="minitabs">
<li><span style="float:left; padding-right:55px"><a href="index.html"><img src="images/greenvalve usa_r2_c2_s1.png" width="" height="" border="0"/></a></span> <a href="#">brie</a></li>

<li><a href="#" class="active">cheddar</a>
</li>
<li><a href="#">gorgonzola</a></li>
<li><a href="#">colby</a></li>
<li><a href="#">ricotta</a></li>
<li><a href="#">mascarpone</a></li>
</ul>

</div> :mad:

abduraooft
10-25-2010, 09:43 AM
The article at http://htmldog.com/articles/suckerfish/dropdowns/ may help you.

ajr901
10-25-2010, 03:22 PM
It did a little bit but not much. Really all i want is to add the 1 level drop down functionality to current menu that i got from simple bits. I cant really seem to figure it out because im going to definitely have to add a bunch of new things to the CSS and i dont even know what it should be. It's not like i know what needs to be added to make it drop down and dont know how to do it, i just all together dont know what im missing at all. :/

The article at http://htmldog.com/articles/suckerfish/dropdowns/ may help you.

Donkey
10-27-2010, 04:05 PM
Really all i want is to add the 1 level drop down functionality to current menu that i got from simple bits.

That's where you are going wrong. It is a bit like saying "I want to add some functionality to my apple and turn it into a banana". You need to start again with a new menu that is designed to work with multi levels. I suggest you go back to the link abduraooft gave you and give it a try.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum