[thelist] [TIP] Solution: Zero body margin with CSS in NN4.x

Craig Saila crsaila at yahoo.ca
Fri Mar 8 16:38:00 CST 2002


Fortune Elkins wrote:
>>You're seeing the whitespace NN4.x puts between most block elements (not
>>TABLES, ironically), which a different and extremely annoying bug.
>
> is there no workaround at all for this? i've tried display:inline with no
> results, and a very quick google search turns up no workaround. . .surely
> there's a dodge for this?

Sort of, but its ugly and only works in certain cases, like this one:
   BODY {margin: -10px 0 0 -10px;}
   HTML BODY { margin: 0; padding: 0; }
   #top { position: absolute; left:-6px; top:-6px; width: 100%;
background-color: green; border: none; }
   DIV#top { left: 0; top: 0; } /* NN4.x won't recognize this */

But this is venturing into the realm of ugly hacks -- one rule for
NN4.x, one to cancel it. Using either HTML element { rule } or
element#id { rule } are best used sparingly. There better solutions to
avoid problems in NN4 such as:
- create a seperate style sheet for NN4 and the rest
- accept that some things will be off in NN4
- use TABLEs

I'd recommmed the first, and this is where @import is beneficial. The
original tip Mark posted was meant to get rid of the invalid  attributes
leftmargin="0" topmargin="0" marginwidth="0" marginheight="0".

For more about hiding CSS from some browsers I strongly recommend:
<http://pixels.pixelpark.com/~koch/hide_css_from_browsers/>

For tips on doing CSS on NN4, read Mark's piece:
<http://www.mark.ac/web/cssnn4.php>


--
Cheers,

Craig Saila
------------------------------------------
craig at saila.com  :  http://www.saila.com/
------------------------------------------


_________________________________________________________
Do You Yahoo!?
Get your free @yahoo.com address at http://mail.yahoo.com




More information about the thelist mailing list