Padding added to 100% width

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Padding added to 100% width

Post by Benjamin »

From what I understand, padding is inside of the box ( http://www.w3.org/TR/REC-CSS2/box.html )

I'm wondering why it's being added to the width of a block element then. In this case a ul..

http://astions.com/chapter2/

I spose I can make a wrapper for it but I shouldn't have to. Am I missing something here?
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

You are right. Padding adds to the width so in this case 100%+46px is too much. What you could do is add a wrapper as you suggested. Another solution is giving #t-intro a left margin. You have an id on the first li already so you might as well use it.
User avatar
Oren
DevNet Resident
Posts: 1640
Joined: Fri Apr 07, 2006 5:13 am
Location: Israel

Post by Oren »

Note that in IE this won't be added to the box, instead, it will be reduced from the total size of the box.
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

I misunderstood the box model. I thought only margins were added to the width, except in IE.

After reading http://www.quirksmode.org/css/box.html I've got it straight. I'm just going to add a wrapper so I won't have to fix it later if I remove the first link.

@Oren, IE 6 is rendering it correctly, in the sense that the padding is being added to the width. Are you referring to an older version?
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

Yes, it's ie5 that has problems. Or IE6 when it's in quirks mode. That happens when you precede the doctype with the encoding declaration (maybe other situations as well, have to look that up). But normally ie6 is fine
User avatar
Oren
DevNet Resident
Posts: 1640
Joined: Fri Apr 07, 2006 5:13 am
Location: Israel

Post by Oren »

matthijs wrote:Yes, it's ie5 that has problems. Or IE6 when it's in quirks mode. That happens when you precede the doctype with the encoding declaration (maybe other situations as well, have to look that up). But normally ie6 is fine
Yes, this is right. IE6 in quirks mode also does that because of historical reasons.
Post Reply