overflow-x
Controls what happens to content that is wider than its container. It can be hidden, clipped, or made to scroll horizontally.
Quick example
.image-gallery {
/* Allows users to scroll horizontally through a row of images */
overflow-x: scroll;
white-space: nowrap;
} Quick facts
Initial value
visibleInherited
No
Applies to
block, flex, and grid containers
Animation type
discrete
Values
visiblehiddenclipscrollauto overflow-x Browser Support
Widely available Since 2020 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.
Safe to use without fallbacks.
1+
3.5+
3+
12+