I've reset my liquid layout page to the specifics below.  Body - font-size 
62.5%
wrapper in ems
all other elements in %'s
and fonts in ems.

Yet to set the max-width but it seems that while it's now a liquid-elastic 
hybrid (?), I didn't realize it would lose the ability to fill up the view port 
, the advantage of a liquid design.  It does look fine in 800x600px, but my 
viewport is set to 1360x1024 and it's a bit narrow.  So am I'm doing something 
wrong ? I thought elastic provides in keeping the pro's of liquid and 
eliminates the con's.

http://pamshop.com/Template1/exp3.html

Mark


-----Original Message-----
From: [EMAIL PROTECTED]
Sent: Sunday, May 28, 2006 9:59 PM -07:00
To: Mark Fellowes [EMAIL PROTECTED]
Cc: CSS List [EMAIL PROTECTED]
Subject: [css-d] Elastic and liquid layout

BTW: the whole thing about scaling the width in em for all
column-containers, is a bit flawed if you're trying to set max-width
equal to window-width or something.

Only the wrapper should have width sized in em, while all
column-containers inside it should have width sized in % of that
wrapper. That'll give full width-control for a single max-width set on
wrapper, instead of having to define one max-width for each element.

Sizing this way makes it easy to adapt a basic 'conditional elastic'
layout to whatever base-width one may choose, since all other elements
will adjust to whatever wrapper-width you set or scale to.
Set wrapper-width to 26em, 50em or 72em, and everything will adjust.
Change % width on column-containers to adjust them to each other and the
em sized wrapper.

It will also allow different em-values for font-size on each column,
without having to re-calculate anything regarding column-width.


Now, if anyone knows how to make an IE-expression (or javascript) to be
triggered by, and "lock" max-width to, a percentage of window-width,
then IE6 can be given a perfect 'conditional elastic' solution too.

        Georg
-- 
http://www.gunlaug.no
______________________________________________________________________
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/
______________________________________________________________________
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