Text-Align: Requirements

---

Text-Align: Class Prefix Options (Required)

The Text-Align Class Prefix can be written in different ways depending on your desired specificity.

Minimal	.txt
Abbr Strict	.txt-align
Strict	.text-align

Text-Align: Class Breakpoint Extensions (Required)

The following breakpoint extension can be customized and extended in the variable-settings.scss file.

Ext	Def	Breakpoint	Device
-tn	tiny	0px	Small Phone
-xs	extra-small	480px	Phone
-sm	small	640px	Small Tablet
-md	medium	768px	Tablet
-lg	large	992px	Laptop
-xl	extra-large	1200px	Desktop
-pr	print	Printed Page	All Devices

Text-Align: Class Value Extensions (Required)

The following Text-Align values are provided.

-center

-left

-right

-justify

Text-Align: Example Code

<!-- Minimal: Text is aligned center then it is aligned left if the screeen is 768px wide. -->
<div class="txt-tn-center txt-tn-left">Text-Align</div>

<!-- Abreviated Strict: Text is aligned center then it is aligned left if the screeen is 768px wide. -->
<div class="txt-tn-align-center txt-tn-align-center">Text-Align</div>

<!-- Strict: Text is aligned center then it is aligned left if the screeen is 768px wide. -->
<div class="text-tn-align-center text-tn-align-center">Text-Align</div>