overflow

• Comments from section
• All comments
• Help

WebPlatform Docs welcomes all comments. If you want to comment, please register or log in. It is free.

This tool helps to make and review comments inline.

How to Use

insert instructions, with images, here

overflow

This page has been flagged with the following issues:

High-level issues:

• Needs Topics

• Missing Relevant Sections

• Data Not Semantic

• Unreviewed Import

Content:

• Incomplete

• Not Neutral

• Cleanup

• Compatibility Incomplete

• Examples Best Practices

Summary

The overflow property controls how extra text exceeding the bounding box of an element is rendered. The overflow property can be used in conjunction with an element that has a fixed width and height, to eliminate text-induced page distortion.

Overview table

Initial value
Applies to	All elements
Inherited	No
Media	visual
Computed value
Animatable	No
CSS Object Model Property

Syntax

• overflow: visible
• overflow: scroll
• overflow: hidden
• overflow: auto

Values

visible

Default. Content is not clipped and scroll bars are not added.

scroll

Content is clipped and scroll bars are added, even if the content does not exceed the dimensions of the object.

hidden

Content that exceeds the dimensions of the object is not shown.

auto

Content is clipped and scrolling is added only when necessary.

Needs Examples: This section should include examples.

Notes

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 clip to the size of the window or frame that contains the object. With Microsoft Internet Explorer 6 and later, when you use the !DOCTYPE declaration to specify standards-compliant mode, this property applies to the html object.

Syntax

overflow: visible | hidden | scroll | auto

Standards information

• CSS 2.1, Section 11.1.1

Compatibility

Desktop

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic Support	1.0	1.0	4.0	7.0	1.0

Mobile

Feature	Android	BlackBerry	Chrome for mobile	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Opera Mini	Safari Mobile
Basic support	?	?	?	?	?	?	?	?

See also

Related articles

Box Model

• border-corner-shape

• bottom

• clear

• float

• height

• left

• line-height

• margin

• margin-bottom

• margin-left

• margin-right

• margin-top

• max-height

• max-width

• min-height

• min-width

• overflow

• overflow-x

• overflow-y

• padding

• padding-bottom

• padding-left

• padding-right

• padding-top

• position

• right

• top

• vertical-align

• width

• z-index

• getBoundingClientRect

Visual Effects

• JavaScript animation

• color

• Color table

• Colors by Hue

• Colors by Name

• Colors by Saturation

• User-Defined System Colors

• CSS cross-fade() function

• css/high contrast mode/properties/-ms-high-contrast

• css/high contrast modeapis/properties/ms-high-contrast-adjust

• css/properties/-ms-progress-appearance

• box-sizing

• clip

• clip-path

• cursor

• opacity

• outline

• outline-color

• outline-offset

• outline-style

• outline-width

• overflow

• text-decoration-blink

• text-decoration-line-through

• text-decoration-none

• text-decoration-overline

• text-decoration-underline

• visibility

• css/properties/zoom

• blink

Related pages (MSDN)

• CSSStyleDeclaration
• currentStyle
• defaults
• runtimeStyle
• style
• Reference
• -ms-overflow-x
• -ms-overflow-y
• position
• Other Resources
• CSS Enhancements in Internet Explorer 6

This article contains content originally from external sources.

Portions of this content come from the Microsoft Developer Network: [Windows Internet Explorer API reference Article]