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

    Join Date
    Feb 2010
    Posts
    10
    Rep Power
    0

    Drop down menu problem with hover state?


    Hi there, im trying to make a website for a friend and im having a little diffuculty with my drop down menu

    the site is here
    bbk.ac.uk/~fsando01/watma/index.html

    when you hover over the link entitled services in the global nav bar and proceed to hover down to the first submenu link which is abs repair, youll notice the background image i set as hover state for the services link disapears, i want it to stay there like they have got on marks and spencers website...

    Please if anyone could help id be very grateful...

    ive tried everthing i can think of
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Change
    Code:
    ul#navlist li a:hover		{	
    		  color: #FFF;
    		  background-color: #003366;
    		  background:url(images/hovermenu.jpg) no-repeat;
    		}
    to
    Code:
    ul#navlist li a:hover,
    ul#navlist li:hover a		{
    		  color: #FFF;
    		  background: #036 url(images/hovermenu.jpg) no-repeat;
    		}
    Usually that then needs to be overridden elsewhere for the links in the sub-menus, but you're being a bit overly specific with your selectors for those sub-menus, so it's already taken care of. (A background declaration following a background-color declaration in the same rule will override the former declaration.)

    P.S. Wow. An animated GIF. How retro. "Green curry"? It looks like a gasoline engine to me.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo