>> >>> Is it possible to have a three column layout with fixed width left
>> >>> and
>> >>> right columns , and variable width center column, WITH a minimum
>> >>> width,
>> >>> using div's ?
>
> At 06:02 AM 7/17/2006, Zoe M. Gillenwater replied:
>>- Float one div left
>>- Float one div right
>>- Give middle div matching left and right margins
>>- Wrap all divs in a container with a minimum and maximum width applied
>
>
> Aaron, Zoe's earlier advice was right on, but you may have failed to
> read it closely enough. The problem with your layout is that your
> markup sequence is float-left, center, float-right -- so the
> floated-right block is falling over to the next row regardless of the
> container width.
>
> If you change your markup sequence to left, right, center as Zoe
> suggested, it will work the way you want.
>
> <div id="container">
>
> <div id="header">
> header
> </div>
>
> <div id="left">
> left
> </div>
>
> <div id="right">
> right
> </div>
>
> <div id="center">
> center
> </div>
>
> </div>
>
> Rationale: The #left block, floated left, causes the next element on
> the page to want to sit to its right. That next block is #right,
> which causes the next element on the page to want to sit to its
> left. The third block is #center, which sits to the left of #right
> and to the right of #left -- i.e., in the middle.
>
> You just have to remember that floating a block left or right
> positions it relative to the following elements on the page, not the
> preceding ones.
>
> Clear as mud?
Right, very logical. That works, thanks alot everyone.
I have updated the online version :-
http://angray.members.beeb.net/Examples/CSS/ThreeColumnExample.html
It has been tested here on IE 6, FF, and Safari.
Anyone able to test NN4 and IE5.5 ?
Many thanks,
Aaron
______________________________________________________________________
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/
