Foundation
Line height
Change the line height of text. Measure classes include responsive prefixes.
.vads-u-line-height--1
1
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
.vads-u-line-height--2
1.15
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
.vads-u-line-height--3
1.35
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
.vads-u-line-height--4
1.5
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
.vads-u-line-height--5
1.62
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
.vads-u-line-height--6
1.75
To fulfill President Lincoln's promise “To care for him who shall have borne the battle, and for his widow, and his orphan” by serving and honoring the men and women who are America’s Veterans.
Responsive prefixes
Add a responsive breakpoint prefix separated with a : to target a utility at a responsive breakpoint and higher, following a mobile-first methodology.
Example
<div class="tablet:vads-u-line-height--2 desktop-lg:vads-u-line-height--5">
$xsmall-screen
$mobile
--mobile
320px
$small-screen
$mobile-lg
--mobile-lg
481px
$tablet
--tablet
640px
$medium-screen
$medium-screen
--medium-screen
768px
$small-desktop-screen
$desktop
--desktop
1024px
$large-screen
$desktop-lg
--desktop-lg
1201px
Read more about breakpoints.