[thelist] Floaty CSS

ben morrison morrison.ben at gmail.com
Thu Nov 15 11:17:39 CST 2007


On Nov 15, 2007 5:02 PM, Dan Parry <dan at virtuawebtech.co.uk> wrote:
> Hi all
>
> I'm having an issue with CSS that's probably really easy and elementary to
> fix, but CSS isn't friendly to me... I have a holder (div) that contains 2
> floated divs as per this diagram:
>
> +--------------------------------+
> |+-------+ +--------------------+|
> ||       | |                    ||
> ||   1   | |          2         ||
> ||       | |                    ||
> |+-------+ +--------------------+|
> +--------------------------------+
>
> Now, how do I make sure that the divs (1 and 2) are always the same height?
> They contain dynamic data and have their own background colours... If 2 is
> larger than 1 then 1 finishes early (can't find a better way of saying that)
> allowing 2 to expand vertically, eventually wrapping underneath 1...
> diagram:

There is no actual way of doing it in CSS but you can *pretend* , you
give them both a width, and to give the appearance of the same height,
you apply a repeating background to the parent div...

Its sometimes called faux columns

http://www.alistapart.com/articles/fauxcolumns/

ben
-- 
Ben Morrison
http://www.benjaminmorrison.com



More information about the thelist mailing list