[thelist] [css] liquid design help, please

Egor Kloos studio at dutchcelt.nl
Mon Aug 4 10:30:51 CDT 2003

> As you can see the right-hand panel is shoved below the left-hand 
> panel.

This is quite normal. Giving a <body> a width of 100% and then adding 
borders and padding will always start scrolling vertically.
Adding two 50% boxes with padding and border would never fit either.

> Is it plausible to
> calculate the width by saying "width: (50% - 2px - 0.5em)" or 
> something?
This is you what should do.
You should always avoid padding, borders and or margins in any object 
where your width is critical.
Kill the body and outer widths. They will fill to the width of your 
border automatically.
So first float empty 50% objects with no margin or padding.
Then insert your bordered boxes with the paddings and border widths.
And that's it. Crossbrowser 50% boxes side by side.

I've set up my example here : http://www.dutchcelt.nl/test/5050.html

hope it was of any help.

Egor Kloos


More information about the thelist mailing list