u-letter-spacing-[dimension]px is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<div class="TestBox
u-letter-spacing-0px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-1px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-2px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-3px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-4px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-5px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-6px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-7px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-8px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-9px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-10px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-11px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-12px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-13px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-14px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-15px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-16px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-17px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-18px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-19px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-letter-spacing-20px">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-fractional-letter-spacing-[dimension]px is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<div class="TestBox
u-fractional-letter-spacing-0px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-1px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-2px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-3px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-4px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-5px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-6px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-7px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-8px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-9px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-10px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-11px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-12px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-13px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-14px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-15px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-16px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-17px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-18px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-19px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-20px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-21px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-22px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-23px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-24px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-25px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-26px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-27px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-28px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-29px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-30px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-31px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-32px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-33px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-34px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-35px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-36px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-37px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-38px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-39px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-40px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-41px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-42px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-43px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-44px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-45px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-46px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-47px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-48px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-49px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-50px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-51px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-52px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-53px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-54px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-55px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-56px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-57px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-58px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-59px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-60px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-61px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-62px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-63px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-64px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-65px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-66px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-67px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-68px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-69px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-70px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-71px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-72px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-73px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-74px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-75px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-76px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-77px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-78px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-79px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-80px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-81px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-82px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-83px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-84px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-85px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-86px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-87px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-88px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-89px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-90px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-91px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-92px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-93px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-94px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-95px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-96px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-97px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-98px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-99px">
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-fractional-letter-spacing-100px">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-fractional-line-height-[dimension]px is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<div class="TestBox
u-max-width-20rem
u-line-height-15px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-16px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-17px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-18px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-19px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-20px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-21px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-22px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-23px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-24px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-25px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-26px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-27px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-28px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-29px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-30px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-31px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-32px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-33px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-34px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-35px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-36px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-37px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-38px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-39px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-40px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-41px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-42px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-43px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-44px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-45px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-46px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-47px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-48px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br><div class="TestBox
u-max-width-20rem
u-line-height-49px">
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-list-style-[type] is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<ul class="u-list-style-none
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-inherit
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-circle
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-disc
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-decimal
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-lower-alpha
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-lower-latin
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-lower-greek
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-lower-roman
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-upper-alpha
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-upper-latin
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-upper-greek
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
<ul class="u-list-style-upper-roman
u-text-color-md-pink-400
u-font-size-500">
<li>
<span class="u-text-color-gray">Lorem ipsum dolor sit amet</span>
</li>
</ul>
<br>
</div>
u-text-uppercase is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-indent-rem
u-font-size-500
u-text-uppercase">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-lowercase is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-indent-rem
u-font-size-500
u-text-lowercase">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-align-center is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-align-center
u-font-size-500
u-text-lowercase">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-align-left is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-align-left
u-font-size-500
u-text-lowercase">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-align-right is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-align-right
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-align-justify is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-align-justify
u-font-size-500">
The content spaces out such that as many blocks fit onto one line as possible
</div>
<br>
</div>
u-text-decoration-none is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-decoration-none
u-font-size-500">
The content renders without any text decoration
</div>
<br>
</div>
u-text-decoration-overline is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-decoration-overline
u-font-size-500">
The content renders without any text decoration
</div>
<br>
</div>
u-text-decoration-line-through is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-decoration-line-through
u-font-size-500">
The content renders without any text decoration
</div>
<br>
</div>
u-text-decoration-underline is applied.
<div class="u-flex
u-flex-column
u-width-30rem">
<div class="TestBox
u-text-decoration-underline
u-font-size-500">
The content renders without any text decoration
</div>
<br>
</div>
u-text-indent-[width]rem is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<div class="TestBox
u-text-indent-1rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-2rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-3rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-4rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-5rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-6rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-7rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-8rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-9rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-10rem
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
</div>
u-text-indent-[width]px is applied.
<div class="u-flex
u-flex-column
u-width-40rem">
<div class="TestBox
u-text-indent-1px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-2px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-3px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-4px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-5px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-6px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-7px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-8px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-9px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-10px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-11px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-12px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-13px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-14px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-15px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-16px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-17px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-18px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-19px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-20px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-21px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-22px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-23px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-24px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-25px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-26px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-27px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-28px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-29px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-30px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-31px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-32px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-33px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-34px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-35px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-36px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-37px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-38px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-39px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-40px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-41px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-42px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-43px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-44px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-45px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-46px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-47px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-48px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-49px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
<div class="TestBox
u-text-indent-50px
u-font-size-500">
Lorem ipsum dolor sit amet
</div>
<br>
</div>