The best CSS3 overflow-x property Tutorial In 2024, In this tutorial you can learn Examples,Browser Support,Attribute definitions and instructions,grammar,

CSS3 overflow-x property

Examples

If it overflows the content area elements - Clip div element left / right edge of the content:

div
{
overflow-x:hidden;
}


Browser Support

Figures in the table represent the first browser to support the version number of the property.

Immediately following the digital -webkit-, -ms- or -moz- ago in support of the prefix attribute first browser version number.

属性
overflow-x 4.0 9.0
8.0 -ms-
3.5 3.0 9.5

Attribute definitions and instructions

overflow-x property specifies if it overflows the element's content area if the clip left / right edge of the content.

Tip: Use theoverflow-y attribute to determine whether the top and bottom edges cropped.

Defaults: visible
inherit: no
version: CSS3
JavaScript syntax: object .style.overflowX = "scroll"


grammar

overflow-x: visible|hidden|scroll|auto|no-display|no-content;

value description
visible No cropping content may be displayed outside the content box.
hidden Crop content - does not provide a scrolling mechanism.
scroll Crop content - provide scrolling mechanism.
auto If the overflow box, it should provide a scrolling mechanism.
no-display If the content is not suitable content box, delete the entire box.
no-content If the content is not suitable for what box, then hide the entire contents.
CSS3 overflow-x property
10/30