Ingo Chao wrote:
a.p. #menu solid clearer float #center-layout
<div id="page"> <ul id="menu">...</ul> <div class="clear"><!-- --></div> <div id="center-layout">...</div> </div>
.clear { clear: both; height: 0;} /* solid clearer which has layout */
For complaints about the illogical clearer fix please write to IE7 dev team ...
p.s.: this construct:
#center-layout { margin: 0pt 2em 2em 12em; float: left; ...} * html #center-layout { margin: 0pt 2em 2em 6em; ...}
is not needed anymore, thanks to: http://positioniseverything.net/explorer/doubled-margin.html
#center-layout { margin: 0pt 2em 2em 12em; float: left; display: inline; ...}
is all you need to fix the doubling-margin bug.
Thanks Ingo,
Putting a clearer element between #menu and #center-layout did the trick. I thought I had tried that before. Obviously not. :-)
I prefer that solution to moving the AP #menu to the bottom of the content because it will display the menu in the "wrong "place for browsers with css turned off. Other than that I agree that the placement of #menu in the content shouldn't matter.
I laugh at your comment to send complaints about the illogical clearer fix to the IE7 development team each time I read it.
Thanks for the suggestion to add /display: inline/ to the #center-layout.. It helped me to get rid of the hacks from the css file.
Carl.
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
