5.1 #Utils.as-block Force block
Force to display as block
Browser support: IE9+, Safari6+, Firefox30+, Chrome30+
display: block to the element.
Markup
<span class="[modifier class] sb-tile sb-padding-s sb-margin-s sb-text--center">I'm a span</span>opacity: 1 to the element.
opacity: 0 to the element.
Markup
<span class="[modifier class] sb-tile sb-padding-s sb-margin-s sb-text--center">I'm a span</span>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>5.4 #Utils.text-alignment Text Alignment
Some text alignment helpers.
Browser support: IE9+, Safari6+, Firefox30+, Chrome30+
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
<p class="[modifier class]">The quick brown fox jumps over the lazy dog</p>5.5 #Utils.visibility Visibility Classes
Some visibility helper classes.
Browser support: IE9+, Safari6+, Firefox30+, Chrome30+
display: none to the element.
Markup
<div class="sb-tile sb-padding [modifier class]">I'm visible</div>