Sent by Dave Silvester on 7 November 2004 20:08
On Sunday 07 Nov 2004 11:23, Marcus A.Hofmann wrote:
> .clear { clear: both; }
> [... some floated divs...]
> <div class="clear"> </div>
[snip]
> As soon as that <div> gets some content, the clear is respected;
That's always been the case with Gecko-based browsers AFAIK, since they don't
render empty divs. I think it's a deliberate "feature" rather than an
accidental bug, although I'm not sure if it really presents any advantages or
disadvantages either way. Anyway, this is the fix for a clearing div:
CSS:
div.clear {
clear: both;
height: 0;
margin: 0;
padding: 0;
line-height: 0;
font-size: 1px;
}
HTML:
<div class="clear"> </div>
I know pixel font sizes are generally regarded as "evil" (and I agree) but in
this case, it's exactly what you want - a clearing div that takes up minimal
space on the page. The non-breaking space makes the div non-empty, and it's
sufficiently small that it doesn't adversely affect the layout of the page.
It's not one for semantic purists, but it's the nicest solution I've seen and
one that I use on a regular basis.
~Dave
--
Dave Silvester
Music Technology Junkie
Web: http://www.mu-sly.co.uk/
Email: sly at mu hyphen sly dot co dot uk
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/