Travis Miller wrote:
> Say you have a two-column layout. Inside one of those columns,
> stacked vertically, you have teasers for several other pages. Each
> teaser consists of a thumbnail image and a paragraph of text.
>
> The thumbnail image should be floated left, with the paragraph
> wrapping around it. And since you don't know how long the paragraph
> will be, you need to clear the float immediately after the paragraph.
>
> *However*: doing this clears *all* left floats, including those on
> the columns - which is not the desired behavior.
> Is there a graceful way around this problem?
If I've understood your case correct - yes.
Establishing a new "block formatting context"[1] for the column will
isolate its content - including all "clear" - from interacting with
other columns.
Something like...
.col {overflow: hidden;}
...on columns, will contain and isolate those columns' content. Useful
for the quite normal "main column in the flow" layouts.
.col {float: left (or right);}
...will work the same way. This is why "all floats" solution works so well.
The above will of course only work well when the columns can expand
freely in height - defaults or are styled to 'height: auto'.
regards
Georg
[1]http://www.w3.org/TR/CSS21/visuren.html#block-formatting
--
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/
