Vertical Align

A series of utility classes that adjust the vertical-alignment property of a inline selector, with support for responsive modifiers.

Install

npm install seed-vertical-align --save

Dependencies

• seed-breakpoints
• seed-publish

Usage

seed-vertical-align provides a vertical aligments for inline elements.

See the list of responsive modifiers.

Example

<span class="u-va-middle tx-h1">Prospector?</span>
<span>You're outta your box!</span>

Configurations

Below are the default Sass configuration variables for seed-vertical-align. The variables can be found in the pack’s _config.scss file.

seed-vertical-align/_config.scss

// Namespace
$seed-vertical-align-namespace: u-va !default;

// Alignment
$seed-vertical-align-alignments: (
  bottom: bottom,
  inherit: inherit,
  initial: initial,
  middle: middle,
  text-bottom: text-bottom,
  text-top: text-top,
  top: top,
) !default;

Related

• seed-centralize
• seed-display