Georg, Thank you for the quick response, informative answer, and stacking resolution. I will also look into the font-sizes. I appreciate your time and effort in providing the coded changes. This was my first listing, and it has been a very positive experience.
Thanks again, Al -----Original Message----- From: Gunlaug Sørtun [mailto:[EMAIL PROTECTED] Sent: Monday, October 15, 2007 12:47 AM To: Al Marvel Cc: [email protected] Subject: Re: [css-d] CSS Flyout Menu Fails in IE7 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/
