Utilities for setting border widths.
Author: Mary Ditchen
Since: 2.0.0
Source: /source/patterns/utilities/border-widths.scss#L9
Default Border Width
XXXS Border Width
XXS Border Width
XS Border Width
Zero Border Width
Inherit Border Width
Initial Border Width
Unset Border Width
<!-- border width default -->
<div class="u-border-width">
<p>Default Border Width</p>
</div><!-- border width xxxs -->
<div class="u-border-width-xxxs">
<p>XXXS Border Width</p>
</div><!-- border width xxs -->
<div class="u-border-width-xxs">
<p>XXS Border Width</p>
</div><!-- border width xs -->
<div class="u-border-width-xs">
<p>XS Border Width</p>
</div><!-- border width zero -->
<div class="u-border-width-zero">
<p>Zero Border Width</p>
</div><!-- border width inherit -->
<div class="u-border-width-inherit">
<p>Inherit Border Width</p>
</div><!-- border width initial -->
<div class="u-border-width-initial">
<p>Initial Border Width</p>
</div><!-- border width unset -->
<div class="u-border-width-unset">
<p>Unset Border Width</p>
</div>
Author: Mary Ditchen
Since: 2.0.0
Source: /source/patterns/utilities/border-widths.scss#L86
Top Border Width
Bottom Border Width
Top Bottom Border Width
<!-- border width top -->
<div class="u-border-width-top">
<p>Top Border Width</p>
</div><!-- border width bottom -->
<div class="u-border-width-bottom">
<p>Bottom Border Width</p>
</div><!-- border width top bottom -->
<div class="u-border-width-top-bottom">
<p>Top Bottom Border Width</p>
</div>
Author: Mary Ditchen
Since: 2.0.0
Source: /source/patterns/utilities/border-widths.scss#L210
Right Border Width
Left Border Width
Right Left Border Width
<!-- border width right -->
<div class="u-border-width-right">
<p>Right Border Width</p>
</div><!-- border width left -->
<div class="u-border-width-left">
<p>Left Border Width</p>
</div><!-- border width right left -->
<div class="u-border-width-right-left">
<p>Right Left Border Width</p>
</div>
Author: Mary Ditchen
Since: 2.0.0
Source: /source/patterns/utilities/border-widths.scss#L334
Danger Alert Border Width
Info Alert Border Width
Success Alert Border Width
Warning Alert Border Width
<!-- border width danger -->
<div class="u-border-width-danger">
<p>Danger Alert Border Width</p>
</div><!-- border width info -->
<div class="u-border-width-info">
<p>Info Alert Border Width</p>
</div><!-- border width success -->
<div class="u-border-width-success">
<p>Success Alert Border Width</p>
</div><!-- border width warning -->
<div class="u-border-width-warning">
<p>Warning Alert Border Width</p>
</div>