Padding and margins

[cscgal]

With regards to cellpadding and cellspacing for tables, and padding and margins for div tags, are they included or excluded in the height and width of a table cell or element?

For example, suppose I have an image of size 100x200 that I would like to enclose in a fixed width div tag with 5px of padding. Must I set the height and width of the div tag to 110x210 to accomidate?

[Patate]

I'm pretty sure that putting 5px of padding will not change the size of the image. If you set the size of the image to 100x200, the image itself will stay at 100x200 but it will take 110x210 because of the 5px on each sides.

[DaveSW]

If I read your query correctly, it's the box model problem.
As I remember it, Mozilla takes the width and adds padding and margins, whilst IE takes the width and subtracts padding and margins...
So the answer is yes and no. lol
I believe some people use a strict doctype and the problem doesn't occur.
I just nest two divs, one with the width and one with margins/padding.

I haven't tested it, but I believe patate is correct that an image shouldn't change size when you add margins...

[Patate]

I don't know about Mozilla but IE adds it. The image doesn't change size. It just adds the padding around the image and the size of the div changes. But that's with IE, I'm not sure about Mozilla...

[DaveSW]

 
 

[Patate]

This makes sense. I was testing with a doctype in EI6 btw.

[DaveSW]

IE 5.x always subtracts padding, regardless of doctype.

It doesn't support padding for images, like 6 in quirks mode.