Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy How do i add a second level to this menu?! :(

    I found this menu bar over at http://simplebits.com/notebook/2003/...he-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.

    Code:
    @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;
    	}
    Code:
    <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>

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation

    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. :/
    Quote Originally Posted by abduraooft View Post

  • #4
    Regular Coder Donkey's Avatar
    Join Date
    Sep 2003
    Location
    Blackfield UK
    Posts
    312
    Thanks
    1
    Thanked 36 Times in 36 Posts
    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.
    " 90% of everything is crud" - Theodore Sturgeon
    Filthy Beast - a 60's Rock Band


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •