Drop down menu is masked behind image, also padding ?

[mlegg]

http://stnickporticons.com/indexmenutest.html is my test page I just made/uploaded to test out the purecssmenu. I used your help from a previous thread on how to make it full width and centered. My problem now with this site is that when you mouse over the Iconography menu that the drop down menu shows up half behind the image. How do I make it so that the drop down is in front?? :confused:

Also my next issue is with the padding in div.one. If you look at the site, or image below, you will see the top paragraph that starts with "In early 2002" has no padding on the left, it's right up to the edge of my white div.
I have it like this:


div.one {
padding: 15px;
min-height:100%;
}


http://i53.tinypic.com/160cv1u.png

I've attached the HTML and CSS files.

[azoomer]

In the stylesmenutest.css line around line 50 you can add a z-index like this:


ul.pureCssMenu ul{
width:164.85px;
z-index: 10;
}

that should make the menu stay in front of the image

The css you have for div.one should work. I think the problem is that you have an html comment right above that rule. html comments <!-- --> are not allowed in css files. If you need a comment you can use this:

/* css comment */

this will work in css and also in javascript files

Anyway, try to remove the html comment and see what happens.

[mlegg]

Thank you for your help.