The issue is similar to a problem already mentioned on css-d [1].
The holy grail's fix
left: 150px; /* RC width */
did never work for me.
The percentage margin bug [2] that is present here can be fixed by:
- omitting percentage margins in IE or
- adding an #innerwrapper with the same dimension the parent element of
the margined box has.
<body>
<div id="page">
<div id="innerwrapper">
...
<div id="menu" ...
I added #innerwrapper to your code.
#innerwrapper { zoom:1; }
The reason is that the percentage margin of #menu skips one generation
when a redraw event is triggered, like in your script.
Before redraw: the %-margin is erroneously calculated with respect to
the grandparent of the element = body
After redraw: the %-margin is correctly calculated with respect to the
parent of the element = page
The static original fix (left: 150px;) cannot compensate for this
dynamic bug; it ignores the fact that the bug is self-compensated on
redraw. The fix is wrong, so delete it:
#menu {
width: 200px;
right: 200px;
margin-left: -100%;
/* _left: 150px; */
}
(Dean's IE7 Script you've mentioned does not need this hack because of
the fixed percentage margin bug in his script.)
In addition, you need to add position:relative to header:
#header {
margin-left: -200px; /* menu width */
position: relative;
}
in order to prevent this from being clipped [3].
You might have seen another issue with Levine's layout [4]: when the
window is sized smaller, the columns start to move. This was discussed
to some extend in another thread [5].
Ingo
[1] http://archivist.incutio.com/viewlist/css-discuss/74961
[2] http://www.positioniseverything.net/explorer/percentages.html
[3] http://www.satzansatz.de/cssd/onhavinglayout.html
[4] http://alistapart.com/d/holygrail/example_4.html
[5] http://archivist.incutio.com/viewlist/css-discuss/85029
PS: please use bottom-posting when replying on css-d, thanks.
--
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/
