Utilities

Overflow

The .overflow-* classes are used to quickly configure how an element's content overflows. There are two additional classes, .overflow-x-* and .overflow-y-*, for configuring the horizontal and vertical overflows individually.

This is an example of using .overflow-auto on an element with set width and height dimensions.
This is an example of using .overflow-hidden on an element with set width and height dimensions.
This is an example of using .overflow-visible on an element with set width and height dimensions.
This is an example of using .overflow-scroll on an element with set width and height dimensions.

    <div class="bg overflow-auto p-3" style="max-height: 100px">
        This is an example of using .overflow-auto on an element 
        with set width and height dimensions.
    </div>
    <div class="bg overflow-hidden p-3" style="max-height: 100px">
        This is an example of using .overflow-hidden on an element 
        with set width and height dimensions.
    </div>
    <div class="bg overflow-visible p-3" style="max-height: 100px">
        This is an example of using .overflow-visible on an element 
        with set width and height dimensions.
    </div>
    <div class="bg overflow-visible p-3" style="max-height: 100px">
        This is an example of using .overflow-visible on an element 
        with set width and height dimensions.
    </div>