siimple 3.2.0 siimple.xyz
Helpers
Utility classes to modify the style of any element.
Text helpers
Basic text helpers
Added in v3.1.0
Text alignment
Use siimple--text-justify to justify text, siimple--text-left to align text to the left, siimple--text-right to align text to the right and siimple--text-center to center text.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Left aligned text
Right aligned text
Center aligned text
<div class="siimple-paragraph siimple--text-justify">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit...
</div>
<div class="siimple-paragraph siimple--text-left">
    Left aligned text
</div>
<div class="siimple-paragraph siimple--text-right">
    Right aligned text
</div>
<div class="siimple-paragraph siimple--text-center">
    Center aligned text
</div>
Text transform
Apply simple text transformations.
Uppercase text!
Lowercase text!
Capitalized text!
<div class="siimple-paragraph siimple--text-uppercase">Uppercase text!</div>
<div class="siimple-paragraph siimple--text-lowercase">Lowercase text!</div>
<div class="siimple-paragraph siimple--text-capitalize">Capitalized text!</div>
Text size, weight and italic
Transform the text size and weight.
Bold text
Italic text
Normal text
Small text
<div class="siimple-paragraph siimple--text-bold">Bold text</div>
<div class="siimple-paragraph siimple--text-italic">Italic text</div>
<div class="siimple-paragraph siimple--text-normal">Normal text</div>
<div class="siimple-paragraph siimple--text-small">Small text</div>
Found a mistake or want to help improve this documentation? Suggest changes.