Al Marvel wrote:
> I investigated several search hits throughout the Web discussing 
> similar problems with IE, z-index, and menus, but many are dated or 
> don't exactly match this problem. I'm asking for assistance in 
> determining if my design is flawed, or if it definitely cannot work 
> in IE7.

> http://marvelka.com/flyout.html

IE/win (any version) can't re-stack anything from within absolute or
relative positioned containers, and '#sidebar .inner' & '#sidebar
.outer' are absolute positioned. That old IE problem hasn't changed for
the last 8-9 years, so earlier notes on it are probably pretty accurate.

Reordering and/or adding elements to source-code will only move the
problem around, and the flyouts on one or the other side will get hidden
in IE7.

IE6 (and older) doesn't support :hover on anything but anchors, so
it won't show flyouts on either side without help of a
'whatever:hover.htc'[1] file or something. IE6 also has its 
'auto-expansion' bug (not respecting given dimensions) that may break 
the line-up.


As with most CSS menus: it definitely doesn't work without a mouse or
similar, in any browser.

It is fine as a demo-case for how to fix such a stacking-problems in IE7
though...
<http://www.gunlaug.no/tos/alien/am/test_07_1015.html>
(I have commented necessary style-changes in the page-head.)

I have "un"-positioned the containers - floated them in place, and
change z-index - re-stack the relevant list-item - to 1 level higher
than the surroundings - only on :hover. That lifts the relevant flyout
visibly on top, regardless of side and source-order.


Note: pixels for font-sizes and line-heights don't work well other than
to potentially break your page under certain conditions in certain
browsers, and the one you have problems with is one of them.

regards
        Georg

[1]http://www.xs4all.nl/~peterned/csshover.html
-- 
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
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/

Reply via email to