Please select a template from top right dropdown box, to see some examples!
Also refer to documentation for more info!
-
Use
.row
and .col-sm-*
to have multiple columns inside a row which will be stacked on top of each other in small devices.
If you add .sm-border
class to .row
, there will be a border separating stacked columns on small devices.
You can also use a single .col
class for less padding.
.row
element can have .padding-*
class for different content padding values.
If you use this, the paddings will be fixed and won't be changed on smaller screens:
<div class="row padding-12"></div>
Use .margin-*
class on .row
to specify spacing between its columns.
-
Use
.clearfix
and .pull-left
or .pull-right
classes to have a table with multiple rows and columns which won't be stacked.
-
Use
.navbar
class for a navbar which has 100% width.
-
Use
.space-*
, .break-*
and .hr-*
classes for spacing or horizontal lines.
For example .break-12
adds a 12px space with body background color
and .space-12
adds a 12px space with content background color.
For .hr-*
you can also add the optional
.padding-*
to add padding from sides.
-
For each of the above classes (.row, .clearfix, .navbar, .space-*, .hr-*) you can use inline styles to override background color:
<div class="space-12" style="background-color: #FF0000;"></div>
-
Add
.pull-left
, .pull-right
class to img
elements
to make them automatically float to right or left on small devices.
-
You can use some classes to style your email. The following classes can be used:
-
Alerts, such as
.alert-info
, etc ...
-
Background classes such as
.bg-primary
, etc ...
-
Wells, such as
.well
, .well-sm
-
Text colors and styles such as
.blue
.red
.text-info
.bigger-110
, etc ...
-
Button & label classes such as
.btn-info
, .btn-sm
, .btn-white
, .no-border
, .label-success
, etc ...
-
Alignment classes such as
.text-right
, .align-middle
, etc ...
-
List classes such as
.list-unstyled
, .spaced
, etc ...
-
And different classes or inline styles such as
font-size
,
line-height
, text-decoration
list-style-type
, etc ...