Forum Moderators: not2easy

Message Too Old, No Replies

CSS Border (part of width or not?)

         

JAB Creations

11:55 pm on Aug 27, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I've checked out the W3C's box model but it just hasn't been clearly expressed to me.

boder: 3px;
width: 100px;

Is the total ACTUAL width supposed ...

1.) ...to be 100px with the border subtracting 3px leaving 94px for content...

... or ...

2.) ... to be 106px with the border adding 3px on both the left and right sides?

I've dealt with this issue a lot since browsers just do not agree. I am assumming IE does not correctly follow which rule it is...I just get a bit confused sometimes! If it is an IE bug is it in their to-do list for IE7 at least (I remember seeing something about border choas but I did not look in to the css bugs in great depth).

Span

10:04 am on Aug 28, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



With a browser in standards mode, the total width of a box is width, border and padding.
So if you have:

#box {
width:100px;
padding:10px;
border:3px solid black;
}

..the total width of this box on your page would be 126px.

JAB Creations

1:31 pm on Aug 28, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ok I understand now...

Odd, you think that instead of "width" they'd have something like "content" or "content-width".