Nick Urbanik wrote:
> http://linus.nicku.org/test-with-empty-div.html
>
> * The first menu solves the problem of the margin under the menu with
> an empty div containing only a --- Horrible HTML for layout!
>
> Although this HTML hack works, it mixes presentation with the
> content, and I really hope to be able to find a better way.
Just delete that hack. It isn't needed.
h2 {clear: both; padding-top: 1em; margin-top: 0;}
h1 {margin-top: 0;}
...will work better, but consistency across browser-land can not be
expected because there's a problem with 'collapsing margins'[1] in that
page.
> * The second menu is made with a div that wraps it. The bottom
> margin seems to displace the popups vertically upwards (in Opera only
> as far as I can tell).
Solution first - add...
div.navWrapper {padding-top: 1px;}
...which indicates a 'collapsing margin', but I'm not sure which one it is.
A quick test shows the "presence" of 'collapsing margins' all over the
place - and browsers treat those margins slightly different.
My test-style is "too rough" for normal implementation, but if someone
wants to hunt 'collapsing margins' then the following might come handy...
body * {display: table; _height: 1%; }
body img {display: inline;}
...and it sure has an effect on that page. Firefox, IE6 and Opera lines
up as if they were "cloned", with only the margin-defaults on paragraphs
which differs.
regards
Georg
[1]http://www.w3.org/TR/CSS21/box.html#collapsing-margins
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
