#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2013
    Posts
    2
    Rep Power
    0

    CSS dropdown doesn't stay visible


    Anyone can help? The drop down menu doesnt stay visible after hovering over it?

    here's the link: delawaresign.com.previewc40.carrierzone.com/about.html

    Thanks!
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,131
    Rep Power
    4304
    Welcome to DevShed Forums, foxfamily238.

    It's because of the "top:2.5em" ".sf-menu li:hover ul, .sf-menu li.sfHover ul". The gap makes it so when you move from the top-level item to the dropdown menu, the cursor moves out from the list-item and therefore the menu hides. I recommend putting a wrapper <div> around the dropdown and give it some top padding instead of using the top property like that.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2013
    Posts
    2
    Rep Power
    0

    Thanks!


    Originally Posted by Kravvitz
    Welcome to DevShed Forums, foxfamily238.

    It's because of the "top:2.5em" ".sf-menu li:hover ul, .sf-menu li.sfHover ul". The gap makes it so when you move from the top-level item to the dropdown menu, the cursor moves out from the list-item and therefore the menu hides. I recommend putting a wrapper <div> around the dropdown and give it some top padding instead of using the top property like that.
    Awesome. Thanks so much!

IMN logo majestic logo threadwatch logo seochat tools logo