Bootstrap 5 Basic
Bootstrap 5 Utilities
Bootstrap 5 Flexbox
Bootstrap 5 provides utility classes to control the overflow behavior of an element. These classes help manage content that exceeds the container’s dimensions
overflow-{direction}-{type}
overflow
: Indicates overflow.direction
(optional): Direction of overflow (e.g., x
, y
).type
: Defines the direction of the margin (e.g., auto
, hidden
, visible
, scroll
).
Class |
Description |
---|---|
overflow-auto |
Adds scrollbars only if content overflows ( |
overflow-hidden |
Hides overflowing content ( |
overflow-visible |
Default. Content is visible outside the box ( |
overflow-scroll |
Always shows scrollbars, even if content doesn’t overflow ( |
overflow-x-auto |
Horizontal scrollbar if content overflows ( |
overflow-x-hidden |
Hides horizontal overflow ( |
overflow-x-scroll |
Always shows horizontal scrollbar ( |
overflow-y-auto |
Vertical scrollbar if content overflows ( |
overflow-y-hidden |
Hides vertical overflow ( |
overflow-y-scroll |
Always shows vertical scrollbar ( |
Try it yourself
Try it yourself
Try it yourself