Previous Message
Next Message

Re: [css-d] Equal height, fluid columns

Sent by Pete on 26 August 2002 23:11


-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1

Thor typed furiously:
TL> Hi list,

====8<-------

TL> So what am I looking for? 3 columns with equal height, in the
form of
TL> reuseable classes. I have no problem in surrounding the columsn
with a
TL> container element, as long as it is either relatively or non
positioned. The
TL> left and right columns could have the same background-color for
all I care,
TL> though separate colors would be a nice surplus.

TL> Any ideas? :)

====8<-------

Hi Thor,

I've been playing with this layout and it seems to work using IE6,
Moz 1.1 and Opera 6 (all PC):

 http://www.thedrum.f9.co.uk/css/3col.html   (minimal styling, so I
don't
 know if adding stuff to it will break it)

 It's probably not the complete solution that you're after but
hopefully
 it may spark someone off with a better answer.  It uses ems so it
 should be fairly flexible.

 I'm on holiday atm so I've not been able to test on anything less
recent
 but the simpler 2 column version _did_ work on an IE5 PC at work
last week
 (though since I've changed it, this may mean nothing) :

 http://www.thedrum.f9.co.uk/css/2col.html

 I've never tried it on ver4 browsers (the use I have for it at work
can
survive them being fed basic styles) and I assume they will have
problems.

The basic idea is to use floats, since you can clear them and place
the
footer under the clearing element.  The floats have no background
defined
but are relatively positioned in 'columns' formed by divs stretching
around
the content and the clearing BR.
IIRC there was some discussion a while back about whether relative
postioning of floats was good practice but since the current browsers
do it
I thought I'd exploit it.


=Pete

 PS Hi all! :)

-----BEGIN PGP SIGNATURE-----
Version: PGP 6.5i

iQA/AwUBPWqsId9706tC3T1+EQJlyACgqF/Qu3Jo1Y01MHDRCkUgmV1TbkYAoO7x
hiXZIFtRkfe9FoWuU5yL1www
=YaVC
-----END PGP SIGNATURE-----
Previous Message
Next Message

Message thread:

Possibly related: