Scroll div

Bootstrap 5 Scroll div component

Responsive Scroll div built with Bootstrap 5. Use these shorthand utilities for quickly configuring how content overflows an element.

Basic example

Use the .overflow-auto class if you want a scroll in your div.

This is an example of using .overflow-auto on an element with set width and height dimensions. By design, this content will vertically scroll.
This is an example of using .overflow-hidden on an element with set width and height dimensions.
Edit in sandbox 
<div class="overflow-auto p-3 bg-body-tertiary"
  style="max-width: 260px; max-height: 100px;">
 This is an example of using <code>.overflow-auto</code>
 on an element with set width and height dimensions. By design, this content will vertically scroll.
 </div>

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

Overflow with image

Put an image into a div with the class .overflow-auto and a fixed size to get an image that can be scrolled.

Mountains in the Clouds
Mountains in the Clouds
Edit in sandbox 
<div class="overflow-auto" style="max-width: 300px; max-height: 250px;">
    <img src="https://mdbcdn.b-cdn.net/img/Photos/Vertical/mountain2.webp"
    class="w-100 shadow-1-strong rounded mb-4" alt="Mountains in the Clouds" />
</div>
<div class="overflow-hidden" style="max-width: 300px; max-height: 250px;">
    <img src="https://mdbcdn.b-cdn.net/img/Photos/Vertical/mountain2.webp"
    class="w-100 shadow-1-strong rounded mb-4" alt="Mountains in the Clouds" />
</div>