5.3 #Utils.overflow Overflow

Toggle example guides Toggle HTML markup

Browser support: IE9+, Safari6+, Firefox30+, Chrome30+

sb-overflow-hidden

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

sb-overflow-x-auto

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

sb-overflow-y-auto

The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

Markup
<div class="sb-grid">
  <div class="sb-overflow-hidden sb-col-3 sb-margin sb-border-black" style="max-height: 200px;">
    <h5>sb-overflow-hidden</h5>
    <p style="width: 250px;">The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</p>
  </div>
  <div class="sb-overflow-x-auto sb-col-3 sb-margin sb-border-black" style="max-height: 200px;">
    <h5>sb-overflow-x-auto</h5>
    <p style="width: 250px;">The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</p>
  </div>
  <div class="sb-overflow-y-auto sb-col-3 sb-margin sb-border-black" style="max-height: 200px;">
    <h5>sb-overflow-y-auto</h5>
    <p>The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</p>
  </div>
</div>
Source: trumps/_helpers.scss, line 23