Modelagem da Caixa no CSS

Standard + Strict vs Quirks + Strict

Box model

The dimensions of the content area of a box -- the content width and content height -- depend on several factors: whether the element generating the box has the 'width' or 'height' property set, whether the box contains text or other boxes, whether the box is a table, etc. Box widths and heights are discussed in the chapter on visual formatting model details.

The box width is given by the sum of the left and right margins, border, and padding, and the content width. The height is given by the sum of the top and bottom margins, border, and padding, and the content height.

Differences

There are two box models, the traditional and the W3C. In Explorer and Opera, the rendering mode decides which box model it follows. In quirks mode it uses the traditional model, in strict mode the W3C model.

Doctype switching is the only way of selecting a box model in Explorer 6 Windows. Mozilla, Opera and Explorer Mac allow the use of the box-sizing declaration to select a box model, while Safari only supports the W3C box model.