guido2004 — 2010-11-12T06:01:42-05:00 — #1
I'm really getting into CSS, and since I have very little experience, I guess you'll notice too
Here's another question:
I added this pure CSS dropdown menu to my site, and after some tweaking I got it to work with background images:
It actually works perfectly in all browsers. The only problem I have is with FF, where the menu works great, but the clickable logo above the menu is 'covered' by the <li> and/or <a>'s of the menu and partially not clickable anymore. You can see the 'covering' with firebug.
I tried adding some z-index, but that made no difference.
paulob — 2010-11-12T06:20:10-05:00 — #2
Just set the z-index like this:
guido2004 — 2010-11-12T06:36:14-05:00 — #3
Thanks Paul. So I needed the
to make it work?
paulob — 2010-11-12T07:33:28-05:00 — #4
Yes only positioned elements can have a z-index applied. If the element is static then you can add position:relative without changing its appearance and then you can apply a z-index.
In IE7 and under it's ultimately the positioned parent that needs to be controlled as that controls the stacking context for all it's children.
cheesedude — 2010-11-15T21:22:05-05:00 — #5
I am not using submenus in my menus. I don't suppose it would be too difficult to do that. Maybe someone with more knowledge than I possess could answer.
You can tweak the CSS to style the menus any way you like. That tutorial linked to above is simply the best in my opinion.