Overflow-x

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; }
.ss64class { overflow-x: hidden; }

#SS64id { 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.


© Copyright SS64.com 1999-2014
Some rights reserved