HTML and CSS Reference
/* Place element in bottom right corner */
The overflow property decides how content overflow is handled for block elements.
It defaults to visible , meaning that text and child elements that expand beyond the
element's content area are visible. Setting the value to hidden hides the overflowing
content, and with the scroll value the element's block becomes scrollable to
accommodate the overflowed content. The auto value is similar to scroll , but the
scrollbars then appear only when necessary.
overflow (block) : visible | hidden | scroll | auto
This property controls the behavior of both horizontal and vertical overflow. Two
additional properties, overflow-x and overflow-y , can be used to differentiate between
how horizontal or vertical overflow is handled. The values for these two properties are the
same as for the overflow property.
overflow: hidden; /* hide all overflow */
overflow-x: hidden; /* hide horizontal overflow */
overflow-y: hidden; /* hide vertical overflow */
The clip property can crop an element into a rectangle if it is positioned as either
absolute or fixed. It uses a CSS function called rect() to specify the clipping region.
clip (absolute | fixed) :
auto | rect(<top>, <right>, <bottom>, <left>)
rect() requires four length values, each separated by commas. These values are
relative to the top-left corner of the element. The example shown in Figure 21-1 cuts out
and displays a 200 x 400 pixel region from the element to which it is applied.
clip: rect(100px, 500px, 300px, 100px);