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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Nov 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Troubles with Dropdown Menus

    I'm having issues with some dropdown menu code i'm using on my blogspot page. If I leave the font as 12px Helvetica, it works just fine. But once I change the size or font, I mouse over the tab and the dropdown menu disappears before I can click it. Can anyone help me fix this? I would like to use bold 24px Calligraffitti. Here is the code:

    Code:
    /*----- MBT Drop Down Menu ----*/
    
    #mbtnavbar { 
    background: ##FFFFFF; 
    width: 960px; 
    color: #FFF; 
    margin: 0px; 
    padding: 0; 
    position: relative; 
    border-top:0px solid #960100; 
    height:35px;
    }
    
    #mbtnav { 
    margin: 0; 
    padding: 0; 
    } 
    #mbtnav ul { 
    float: left; 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    } 
    #mbtnav li { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    border-left:0px solid #333; 
    border-right:0px solid #333; 
    height:35px; 
    } 
    #mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited { 
    color: #000000; 
    display: block; 
    font:normal 12px Helvetica, sans-serif; 
    margin: 0; 
    padding: 9px 12px 10px 12px; 
    text-decoration: none; 
    
    } 
    #mbtnav li a:hover, #mbtnav li a:active { 
    background: #FFFFFF; 
    color: #000000; 
    display: block; 
    text-decoration: none; 
    margin: 0; 
    padding: 9px 12px 10px 12px; 
    
    
    
    }
    #mbtnav li { 
    float: left; 
    padding: 0; 
    } 
    #mbtnav li ul { 
    z-index: 9999; 
    position: absolute; 
    left: -999em; 
    height: auto; 
    width: 160px; 
    margin: 0; 
    padding: 0; 
    } 
    #mbtnav li ul a { 
    width: 140px; 
    } 
    #mbtnav li ul ul { 
    margin: -25px 0 0 161px; 
    } 
    #mbtnav li:hover ul ul, #mbtnav li:hover ul ul ul, #mbtnav li.sfhover ul ul, #mbtnav li.sfhover ul ul ul { 
    left: -999em; 
    } 
    #mbtnav li:hover ul, #mbtnav li li:hover ul, #mbtnav li li li:hover ul, #mbtnav li.sfhover ul, #mbtnav li li.sfhover ul, #mbtnav li li li.sfhover ul { 
    left: auto; 
    } 
    #mbtnav li:hover, #mbtnav li.sfhover { 
    position: static; 
    }
    #mbtnav li li a, #mbtnav li li a:link, #mbtnav li li a:visited { 
    background: #CCCCCC; 
    width: 120px; 
    color: #000000; 
    display: block; 
    font:normal 12px Helvetica, sans-serif; 
    margin: 0; 
    padding: 9px 12px 10px 12px; 
    text-decoration: none; 
    z-index:9999; 
    border-bottom:1px dotted #333;
    
    } 
    #mbtnav li li a:hover, #mbtnavli li a:active { 
    background: #CCCCCC; 
    color: #000000; 
    display: block; 
    margin: 0; 
    padding: 9px 12px 10px 12px; 
    text-decoration: none; 
    }
    Last edited by Lala-chan; 11-13-2011 at 11:07 PM.

  • #2
    Senior Coder
    Join Date
    Dec 2005
    Location
    Slovenia
    Posts
    1,958
    Thanks
    120
    Thanked 76 Times in 76 Posts
    I would like to use bold 24px Calligraffitti
    Do not. Avoid that at all costs. There is chance that that font will not be on end user machine/os/browser.

    limit yoursef to something like this:

    Code:
     *
     {
    font-family:tahoma,verdana,arial,helvetica;
    }
    search the web for most common fonts.
    Found a flower or bug and don't know what it is ?
    agrozoo.net galery
    if you don't spot search button at once, there is search form:
    agrozoo.net galery search


  •  

    Tags for this Thread

    Posting Permissions

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