1.0.3 • Published 6 years ago
@citizensadvice/text-align v1.0.3
Text-align 
Defines the horizontal alignment of text.
Classes
| Class names | Value |
|---|---|
.text-left | Align content left |
.text-right | Align content right |
.text-center | Align content center |
.text-justify | Jutify content |
Responsive text-align classes
To apply specific classes at set screen widths, use the following classes:
| Abbr | Value |
|---|---|
ns | $breakpoint-ns (min-width: 48rem) |
m | $breakpoint-m (min-width: 48rem, max-width: 64rem) |
l | $breakpoint-l (min-width: 64rem) |
Examples
<div class="text-left text-center-l">Lorem ipsum</div>
// This will align content to the left on devices with a width up until 64rem where upon it will be
centered.Installation
$ npm install @citizensadvice/text-alignnow import into your stylesheet...
@import '@citizensadvice/text-align/index.scss';You can make use of the unpkg service, try adding the link below to the head of your HTML file.
<link src="https://unpkg.com/@citizensadvice/text-align@latest/build/text-align.css" />