overflow
Sets a value indicating how to manage the content of the object when the content exceeds the height or width of the object.
Syntax
{ overflow:
sOverflow }
Possible values
sOverflow
String that specifies one of the following values:
visible |
Default. Content is not clipped and scroll bars are not added. |
auto |
Content is clipped and scrolling is added only when necessary. |
hidden |
Content that exceeds the dimensions of the object is not shown. |
scroll |
Content is clipped and scroll bars are added, even if the content does not exceed the dimensions of the object. |
The property has a default value of visible for all objects, with the exception of textarea which has a default value of auto. This property is not inherited.
Remarks
The default value for the body element is auto.
Setting the overflow property to hidden on a textarea object hides its scroll bars.
Setting the overflow property to visible causes the content to be clipped to the size of the window or frame that contains the object.
Examples
The following example uses the overflow property to manage content of the object. This example uses an inline style to automatically adjust itself to overflowing content when the page is loaded:
<div id=odiv style="width: 200px; height: 200px; overflow: auto;">
:
</div>
In this example, the user can dynamically change the overflow property of a DIV object by choosing one of the possible overflow values from a select object:
<script>
function SetOverflow(o, svalue )
{
o.style.overflow = svalue ;
}
</script>
<div id="div1"
style="font-size:18pt;background-color:yellow;height:50px;width:75px">
The quick brown fox jumps over the lazy dog.
</div>
<select onchange="SetOverflow(div1,
this.options[this.selectedIndex].text)">
<option selected>visible
<option>scroll
<option>hidden
<option>auto
</select>
Standards information
This property is defined in Cascading Style Sheets (CSS), Level 2 (CSS2) .
Applies to
a, abbr, acronym, address, applet, b, bdo, big, blockquote, body, center, cite, code, col, colgroup, custom, dd, defaults, del, dfn, div, dl, dt, em, embed, fieldset, font, form, html, hn, i, input type=button, input type=checkbox, input type=file, input type=image, input type=password, input type=radio, input type=reset, input type=submit, input type=text, ins, li, ol, p, q, rt, ruby, s, span, sub, tt, u, ul, var, xmp
See also
Concepts
Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.