Link to home
Create AccountLog in
Avatar of Steve Bink
Steve BinkFlag for United States of America

asked on

z-index issue in IE7

Please see https://www.irongatecafe.com

The issue is with #menu_bar_2 (4 food pictures in the upper left below the logo) vs #content (the big green box).  In FF and IE8, the pictures in #menu_bar_2 properly appear above the #content div.  In IE7, the #content div obscures them where they intersect.  I have tried playing with z-index on both elements to no avail.  How can I resolve this?
ASKER CERTIFIED SOLUTION
Avatar of Mark Steggles
Mark Steggles
Flag of United States of America image

Link to home
membership
Create an account to see this answer
Signing up is free. No credit card required.
Create Account
Avatar of Steve Bink

ASKER

Can you explain why that works?  Also, I'd really appreciate some links to info on stacking context, if you've got 'em.  I'm a firm believer in RTFM.  :)
sitepoint.com is a good place to go for info on css/html.. try this article on stacking context http://reference.sitepoint.com/css/stacking

This works in all browsers because it sets header and everything in it higher than its next sibling element whose z-index is just auto.