Hi folks,
I've been using CSS designs for a while now but mostly just simple stuff.

I'm wondering now how do I make a div resize in height to match the content of other divs in the same parent div. For instance how can I get the the left blue col and the red blue col to extend down to match up with the main body content on

http://www.akamarketing.com/css.html (nicked the css code)

I was on glish.com and a lot of mentions about horiztonal sizing issues (resolutions, fluid designs etc.) but didn't spot my answer as nothing much on vertical issues.

If I statically define, the contain height to say 800px and then set each col (left,center,right) to 800px sure that will work but very inflexible as content can be any size and since site will run off a CMS left and right nav wiill be changeable too.

If I was using a HTML table it would be fine:

<table>
<tr><th colspan=3>HEADER</th></tr>
<tr><td bgcolor=blue >left</td><td bgcolor=grey>main content</td><td bgcolor=red>right</td></tr>
</table>

If I had more content in one col, the other cols would still match up. The bottom of the above page has the table version. Is this possible with CSS? Get what I'm trying to achieve?

thanks in advance.

you could look at some of the layouts here
http://matthewjamestaylor.com/blog/u...d-pixel-widths

Originally Posted by davemies

you could look at some of the layouts here
http://matthewjamestaylor.com/blog/u...d-pixel-widths

thanks man, excellent link.

http://matthewjamestaylor.com/blog/e...r-css-no-hacks - this has the specific fix.

The EASIEST way to keep them all equal is the faux columns method, no extra divs either.