template_documentation.jpg

TEMPLATE DOCUMENTATION

Text Alignment

Our templates come with pre-defined text alignment CSS classes that you can use easily. Instead of adding inline CSS to each module, it's recommended to use the classes listed below.


In this article


List of Classes

Type of Alignment CSS Class
Left Alignment text-alignleft
Center Alignment text-aligncenter
Right Alignment text-aligncenter
Justify Alignment text-alignjustify
Left Alignment (on mobile) mb-text-alignleft
Center Alignment(on mobile) mb-text-aligncenter
Right Alignment(on mobile) mb-text-aligncenter
Justify Alignment(on mobile) mb-text-alignjustify

Note: You'll just need to add 'mb-' at the beginning of each CSS class to set the alignment on mobile devices, below 768px.


How to use the CSS class:

1. Open the template from design manager, and open the template you want to edit.

2. Scroll to the module you want to edit

3. Click Settings > Edit CSS

open_edit_css_popup.gif

 

4. A popup will appear and you can add the CSS class in the 'Custom CSS Class' input field

adding_class.gif

 

5. Click Save and Publish the template

Get this pack while it's hot!

attract-pack.jpg

Get me a copy