|
|
Posted by Ben C on 01/12/07 23:13
On 2007-01-08, dorayme <doraymeRidThis@optusnet.com.au> wrote:
[snip]
> In case anyone is interested, I was supposing that when you have
> a box and float stuff in it, subsequent clears in that box would
> apply only to the floats in that box.
No, clear clears any floats that are in the way (or perceived to be in
the way).
> But yesterday I had a clear that took account of another float outside
> the box. Or sure seemed to!
That is correct behaviour.
> Simple enough really though: page had a left floated nav col and
> a right content div box (margined to give the left nav float a
> formal space to sit in). Inside the div content box, at the very
> start I had a little float (to accommodate one drop-cap letter -
> it is all Farmer Joe's fault), for a little one line sentence.
> The point is that when I cleared the float for the next heading,
> the heading jumped down to clear the nav floated box. It is no
> good me knowing this is "correct" behaviour.
I'd better try and explain it then. See below.
> I need to think about it more not to be puzzled! Perhaps I have missed
> something quite simple and if fixed, can go back to using clear
> properly!
I think the thing that's easy to forget about floats is that they're
sort of intended for things like pictures and diagrams embedded among
paragraphs of text.
If you're using them like that, you want them to overflow the bottom
edges of paragraphs, and for text in following paragraphs to flow around
them. You want clear to clear any float that's in the way, regardless of
whether it originated in an earlier paragraph.
Another natural consequence of the "intended" purpose of floats is the
rule that a block box doesn't usually grow vertically to accommodate the
floats in it. This was causing someone trouble recently on one of the
c.i.w.a.* groups.
The rules seem quite natural when you're embedding diagrams in a series
of paragraphs, but sometimes catch people out in unexpected ways when
when they're using floats to do columns or to simulate inline-blocks.
I think the reason it's particularly counterintuitive in your example is
that the big white div has a left-margin, so the nav col float is
already out of the way of the text. But the browser doesn't think like
that, it just applies the rules, and clear means "go down past the
floats". As far as it's concerned, the margin has nothing to do with it.
Navigation:
[Reply to this message]
|