Overflow

Control how content overflows an element's box.

Basic Usage

• .overflow-auto - Adds scrollbars only when content overflows.
• .overflow-hidden - Hides content that overflows.
• .overflow-visible - Lets content overflow (default).
• .overflow-scroll - Always shows scrollbars, even if not needed.

Example

This is a bunch of text inside a container with .overflow-auto. If the text gets too long, a scrollbar will appear.

This is a bunch of text inside a container with .overflow-hidden. Any text that overflows the container's box will be clipped and hidden from view.

<div class="overflow-auto">...</div>
<div class="overflow-hidden">...</div>