Kathleen Ballard wrote: > Dear List, > > I have 2 sites that are broken in ie7. I have experimented with the css a > bit and can't seem to find what it is that gives ie7 fits. > If anyone can give me a push in the right direction, I would really > appreciate it.
> The first site is here: > > http://www.elementalfitness.net <http://www.elementalfitness.net/> I overlooked your thread due to the misleading subject line. You have some complex problems here, don't have time to look at your second problem. In navigation.js, you are determining the height of the RootMenuHeight, but this fails in IE7, because the RootMenuHeight = getRootMenuHeight('colWrapper'); is calculated 0px height, since the clearing of the colWrapper does not apply, the child floats are not contained, see below. Therefore, the height of the objChild.style.height = RootMenuHeight + "px"; in setChildMenusHeight() is determined to 0, too. In effect, the submenu's height is set to 0px, as the height of the colwrapper is 0px. Not good. This is because your .clear class breaks in IE7 .clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* Hides from IE-mac \*/ * html .clear {height: 1%;} /* End hide from IE-mac */ This is not sufficient in IE7, as it does not understand the :after pseudo-element, because MS programmers did not implement this in the last couple of years. But they have fixed the star html "bug", hurray, but not the haslayout-bug [1]. * html .clear {height: 1%;} is not seen by IE7, therefore, haslayout is not triggered here. But IE7 needs haslayout here for several reasons: - auto-containing floats - correct stacking for relatively positioned elements [2] (the navleft is placed /under/ its floating parent and disappears.) So most of the problems in this page should be fixed by adding a zoom:1; to the .clear class in a conditional comment for IE7. Alternatively, apply the original clearfix class instead [3, 4], which uses display: inline-block to trigger haslayout. Ingo [1] http://www.satzansatz.de/cssd/onhavinglayout.html [2] http://www.satzansatz.de/cssd/rpfloat.html [3] http://positioniseverything.net/easyclearing.html [4] http://www.tanfa.co.uk/archives/show.asp?var=300 -- http://www.satzansatz.de/css.html ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
