Skip to main content

Stack Space

Version: 0.9.0
Edit

Utilities that define the space below stacked items.

Space Stack

Author: Mary Ditchen
Since: 0.9.0
Source: /source/patterns/utilities/space-stacks.scss#L11

Space Stack
Space Stack Compact
Space Stack Tight
Space Stack Loose
Space Stack Expanded
Space Stack Spacious
Space Stack Zero
Space Stack XXXS
Space Stack XXS
Space Stack XS
Space Stack Small
Space Stack Medium
Space Stack Large
Space Stack XL
Space Stack XXL
Space Stack XXXL
<!-- space stack -->
<div class="u-space-stack">Space Stack</div>
<!-- space stack compact -->
<div class="u-space-stack-compact">Space Stack Compact</div>
<!-- space stack tight -->
<div class="u-space-stack-tight">Space Stack Tight</div>
<!-- space stack loose -->
<div class="u-space-stack-loose">Space Stack Loose</div>
<!-- space stack expanded -->
<div class="u-space-stack-expanded">Space Stack Expanded</div>
<!-- space stack spacious -->
<div class="u-space-stack-spacious">Space Stack Spacious</div>
<!-- space stack zero -->
<div class="u-space-stack-zero">Space Stack Zero</div>
<!-- space stack xxxs -->
<div class="u-space-stack-xxxs">Space Stack XXXS</div>
<!-- space stack xxs -->
<div class="u-space-stack-xxs">Space Stack XXS</div>
<!-- space stack xs -->
<div class="u-space-stack-xs">Space Stack XS</div>
<!-- space stack sm -->
<div class="u-space-stack-sm">Space Stack Small</div>
<!-- space stack md -->
<div class="u-space-stack-md">Space Stack Medium</div>
<!-- space stack lg -->
<div class="u-space-stack-lg">Space Stack Large</div>
<!-- space stack xl -->
<div class="u-space-stack-xl">Space Stack XL</div>
<!-- space stack xxl -->
<div class="u-space-stack-xxl">Space Stack XXL</div>
<!-- space stack xxxl -->
<div class="u-space-stack-xxxl">Space Stack XXXL</div>