This template uses Bootstrap UI Toolkit and framework and therefore it uses a complex but so useful grid system.
Instead of in-depth explaining here i would better suggest heading over the Bootstrap website as there are massive useful info’s about the grid system which are far better explain that i ever could.
Just some short tips:
- There are 12 columns
- there are 4 states of how is the grid applied –
- You can have all 4 types of classes tied to a column eg: class=”
col-lg-3” (this means that on large devices the column will occupy 3 columns, while on medium devices 4 columns, 6 colums on small devices and 10 colums on even smaller devices such as smartphones or phablets).
- If you just add a
lgcolumn class (eg
col-lg-6), it will only occupy the #no o cols you specified (6), on large devices (1200+), while on smaller devices it won;’t have any predefined width, just 100%.
- if you add a single
mdcolumn class (eg
col-md-6), it will only occupy the #no o cols you specifed (6) but on medium and large devices (992+), while on smaller devices it won’t have any width, just 100%
- Grids must be inside of a
.row, while a
.rowmust be inside a