On 19/11/2010 9:27 AM, Tim Wolf wrote:
Thanks to the information discussed a couple weeks back on this issue
I thought I had the IE7 z-index issue solved with my drop-down menu.
Apparently not.
You running into a similar issue with IE7 handling of position:relative
which incorrectly
establishes a new stacking context [1].
My CSS-only (slightly modified Stu Nichols droplist) drop-down menu
was displaying (stacking) behind the content below the navs. Had it
fixed until I added more content.
This is an IE7 and IE8 issue (works in FF, Opera, Safafri). Notice
how it lays above the gradient grey border but below the divs with
the blue background images.
This does not affect IE8.
Here a a slightly simplified version of the page:
http://uatext1.cga.ct.gov/sdo/index-test2.php
or a version with more content within those divs:
http://uatext1.cga.ct.gov/sdo/index-test.php
There are a bunch of CSS files being called to. Here are the primary
ones in addition to a reset.css:
http://uatext1.cga.ct.gov/sdo/css/base.css
http://uatext1.cga.ct.gov/sdo/css/index.css
http://uatext1.cga.ct.gov/sdo/inc/inc-css/header.css
The header code is being pulled into the page via a PHP include.
I've tried a variety of z-index experiments. Tried to make anything
that didn't need to have the position element not have one. I even
tried a jQuery script that promised to solve all my problems,
Help!
Tim Wolf
The problem is cause by the below CSS or any other elements with both
position: relative and hasLayout that come later in the source.
#container-fea {
position: relative;
height: 350px; /* hasLayout trigger */
}
To help IE7- one must goes back up the tree to the element that is the
sibling to the div.container-940. This is the div#header. The following
will sort IE7- out.
#header {
width: 960px;
height: 140px;
margin: 0 auto 0 auto;
position: relative;
clear: left;
z-index: 1; /* to help IE7- along */
}
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
