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

    Join Date
    Aug 2010
    Posts
    15
    Rep Power
    0

    CSS Drop Down Menu


    http://www.obanwinterfest.co.uk/Cottage/

    I have a working drop down menu. Now the problem is clear if you look at the above link. Hover over cottages.

    I added in a JSQuery image rotator, in a seperate div, but the drop down menu keeps going behind the images.

    I Cannot figure out how to get the drop down to the front.

    Can anyone help please?

    CSS is here: http://obanwinterfest.co.uk/Cottage/Includes/Styles.css
  2. #2
  3. ~ bald headed old fart ~
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2005
    Location
    chertsey, a small town s.w. of london, england
    Posts
    253
    Rep Power
    87
    Hi there Cakeface,

    try adding "z-index:7;" to your "nav ul ul" rules.

    coothead
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    875
    Rep Power
    276
    to get the menu to show over the other div, ...in your styles.css file, goto line 100
    change
    Code:
    nav{
    	margin:0px;
    	padding:0px;
    	}
    to
    Code:
    nav{
    	margin:0px;
    	padding:0px;
    position:relative;
    z-index:100;
    	}
    then, to get the gap to close up, so, the submenu will work properly, goto line 59 in your styles.css file
    and in your nav ul ul rule, remove the top:100%; property.
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2010
    Posts
    15
    Rep Power
    0
    Thank you guys so much. Brilliant help.

IMN logo majestic logo threadwatch logo seochat tools logo