DIV'S AGAIN :)

[cranebill]

HiI have laid out a header and 3 column page using margains to get a block in the screen with white edges (one day I will learn to add an image or nice beckground. my coding is on the other thread.Anyway, my question isI have 3 divs and I have them in this order as it would not work in a logical orderleft div 4 cms wide float leftright div 4 cms wide float right center div auto widthwhy does it work like this when this seems the logical order of thingsleft div 4 cms wide float leftcenter div auto widthright div 4 cms wide float right

[jeffman]

As you probably guessed, it's the float:right property combined with the fluid-width center div. If you knew all the widths beforehand, you could float all the divs to the left in the visual order, what you call the logical order. But you want the width of the center to be fluid. Its width is derived from the width of the viewport, the left div and the right div. So the right div has to be positioned before the center div. Thus the right div must float to the right. The center div simply floats up next to it and fills the space from right to left.Or try this: have five divs float right in this sequence: a b c d e. Visually, they will appear in reverse order: e d c b a. But logically, this is correct, because they fill in from the right, not the left. Logic doesn't understand that you read from left to right. Paragraphs and other structures have to be told to flow in that direction. If you use the float property to reverse that, then reversed it will be.

[cranebill]

As you probably guessed, it's the float:right property combined with the fluid-width center div. If you knew all the widths beforehand, you could float all the divs to the left in the visual order, what you call the logical order. But you want the width of the center to be fluid. Its width is derived from the width of the viewport, the left div and the right div. So the right div has to be positioned before the center div. Thus the right div must float to the right. The center div simply floats up next to it and fills the space from right to left.Or try this: have five divs float right in this sequence: a b c d e. Visually, they will appear in reverse order: e d c b a. But logically, this is correct, because they fill in from the right, not the left. Logic doesn't understand that you read from left to right. Paragraphs and other structures have to be told to flow in that direction. If you use the float property to reverse that, then reversed it will be.

Thanks, seems to make sense