overflow
Generally, the content of a block box is confined to the content edges of the box. In certain cases, a box may overflow, meaning its content lies partly or entirely outside of the box, e.g.:
- A long line that cannot be broken (i.e. a URL), causing the line box to be wider than the block box.
- A block-level box is too wide for the containing block.
- An element’s height exceeds an explicit height assigned to the containing block.
- A descendant box is positioned absolutely, partly outside the box.
- A descendant box has negative margins, causing it to be positioned partly outside the box.
- The ‘text-indent’ property causes an inline box to hang off either the left or right edge of the block box.
Whenever overflow occurs, the ‘overflow’ property specifies whether a box is clipped to its padding edge, and if so, whether a scrolling mechanism is provided to access any clipped out content.
Nothing is clipped, but scroll forces the scrollbars.
When ‘scroll‘ is specified and the target medium is ‘print‘, overflowing content may be printed.
In the case of a scrollbar being placed on an edge of the element’s box, it should be inserted between the inner border edge and the outer padding edge. Any space taken up by the scrollbars should be taken out of (subtracted from the dimensions of) the containing block formed by the element with the scrollbars.
IE6 does not create scroll bars unless the container has a layout.
The iPad does not support ‘scroll’.
