Did you see my earlier post? The 3 col sample I sent through should work
fine. The version you mention below will not work because you are
misunderstanding the fundamentals of the box model.

Padding, border and margins are added to the OUTSIDE of a container in CSS.
This means you have three containers set to 100% and then you are adding 6
pixels of border (2px per box) to this total. This makes 100% + 6px = more
than 100%.

Floated items are very blunt -  like small kids. If they cannot fit they
will tell you. They simply go down, line by line until there is room for
them to fit. That is what has happened to your layout.

Have a look at the one I sent before. It is very stable and easy to do. It
relies on one simple thing - the middle column is static - in the flow - and
it has margin on the left and right to make it look like a centre column.

Always good to leave something in the normal flow of the document.

Another aside, don't get carried away with inline! Especially when you are
also trying to float something. Any floated item immediately becomes a box -
it has too, so if you convert it back to inline, it will probably do
something very odd.

Russ



> I hope I am not starting to annoy anyone ;-))
> 
> 
> <div style="width: 100%; border: 1px solid red;">
> Creates a area 100% wide, i.e. covering the width of the viewing area, which
> is great.
> 
> <div style="position: relative; border: 1px solid black; width: 33%; display:
> inline;">Column 1</div><div style="position: relative; border: 1px solid
> black; width: 33%; display: inline;">Column 2</div><div style="position:
> relative; border: 1px solid black; width: 33%; display: inline;">Column
> 3</div></div>
> 
> The there are 3 divs that all have a width of 33%, but they don't fill the
> 100% wide area covering it. If working with tables this would have worked, why
> not in CSS?
> 
> PS. I am new to layout with CSS, I only discovered what INLINE does a couple
> of days ago ;-)) I had always used CSS for style but never layout, always
> tried to keep it of for as long as possible.... Today I decided it was the day
> to learn it, you guys are the ones suffering for it ;-))
> 


Thanks
Russ

-----------------------------------------------
Russ Weakley
Max Design
Phone: (02) 9410 2521
Mobile: 0403 433 980
Email: [EMAIL PROTECTED]
http://www.maxdesign.com.au
-----------------------------------------------


*****************************************************
The discussion list for http://webstandardsgroup.org/
***************************************************** 

Reply via email to