I thought I'd share this with the list, as I haven't seen it anywhere
before.

Working on a project I needed a way to have full height on a 3-column
layout, which should also be elastic. That is resizes in width upon
font-resizing, instead of pushing the text further down as in fixed width or
fluid layouts.

I started by adding some extra wrappers around the content to use background
images, as in normal faux columns, but couldn't get it to work. I realised
the solution would be not adding the extra divs around the content, but
setting them inside the content and using a mix of absolute and relative
positioning, plus the desired widths. At first I used height: 100% to make
the columns span the whole way. Offcourse that wouldn't work in IE, so I
changed it to a high pixel-value, and set the parent container to overflow:
hide;

So far this seems to work in most modern browsers, as well as IE6/Win.

It's still pretty rough, but I'd love some comments on this :)
An example can be seen here:
<http://www.eystein.no/faux-columns.html>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to