Each box has a content area and optional surrounding padding, border, and margin areas. The size of each area is specified by properties. The margin, border, and padding can be broken down into top, right, bottom, and left segments. The perimeter of each boxes is called an “edge”, so each box has four edges.

min-width and min-height apply to the content box.

‘padding’ and ‘border’ work the same with these properties as they do with ‘width’ and ‘height’. The pink box is 180 pixels by 180 pixels (the ‘min’ and ‘padding’ values).

IE 6 does not ‘support’ min-width and min-height, but width and height work the same. This is because ‘width’ and ‘height’ are broken in IE 6.

Try These

Watch This


Check This

<div id="aqua">aqua</div> <div id="yellow">yellow</div> <div id="pink">pink</div>

Edit This

Use shift + enter to create new lines (even in Safari and Chrome).