Whether to clip the left/right edges of overflowing content.
Syntax
overflow-x: overflow | inherit ;
auto - Provide scrollbars when necessary.
hidden - Clip and hide any overflowing content.
scroll - Clip any overflowing content but provide a scrollbar.
visible - Render overflowing content outside the element’s box (default)
no-display - If the content does not fit in the content box, the whole box is removed.
no-content - If the content does not fit in the content box, the whole content is hidden.
inherit - Inherit the property from a parent element.
Examples:
h1 { overflow-x: auto; }
.emw3class { overflow-x: hidden; }
#emw3id { overflow-x: scroll; }
Try it:
mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm This sample text contains some long strings without spaces that won't wrap onto the next line. nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn more sample text: nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn. |
Browser Support: All major browsers (CSS 3+) IE 9+
“.. almost everything – all external expectations, all pride, all fear of embarrassment or failure ~ these things just fall away in the face of death, leaving only what is truly important” ~ Steve Jobs
Related:
overflow - What happens if content overflows an element's box.
overflow-y - Whether to clip the top/bottom edges of overflowing content.