Elements
These modular elements can be readily used and customized across pages and in different blocks.
Columns <> show code
<div class="row">
<div class="col-md-12">
1 of 1
</div>
</div>
<!-- width devided by Two -->
<div class="row">
<div class="col-md-6">
1 of 2
</div>
<div class="col-md-6">
1 of 2
</div>
</div>
<!-- width devided by Three -->
<div class="row">
<div class="col-md-8">
2 of 3
</div>
<div class="col-md-4">
1 of 3
</div>
</div>
<div class="row">
<div class="col-md-4">
1 of 3
</div>
<div class="col-md-4">
1 of 3
</div>
<div class="col-md-4">
1 of 3
</div>
</div>
<!-- width devided by Four -->
<div class="row">
<div class="col-md-3">
1 of 4
</div>
<div class="col-md-9">
3 of 4
</div>
</div>
<div class="row">
<div class="col-md-3">
1 of 4
</div>
<div class="col-md-3">
1 of 4
</div>
<div class="col-md-3">
1 of 4
</div>
<div class="col-md-3">
1 of 4
</div>
</div>
<!-- width devided by Six -->
<div class="row">
<div class="col-md-10">
5 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
</div>
<div class="row">
<div class="col-md-2">
1 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
<div class="col-md-2">
1 of 6
</div>
</div>
How to use
- All columns are created using bootstrap grid columns. For more you can see here
Example
1/1
Lorem ipsum dolor sit amet consectetur adipisicing elit sed do eiusm tempor incididunt.labore dolore magna aliqua.ullamco laboris nisi ut aliquip ex ea commodo consequat duis aute irure dolor eprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur excepteur sint occaecat cupidatat non proident.
1/2
Lorem ipsum dolor sit amet consectetur adipisicing elit sed eiusm tempor incididunt.labore dolore magna aliqua.ullamco labor nisi ut aliquip.
1/2
Lorem ipsum dolor sit amet consectetur adipisicing elit sed eiusm tempor incididunt.labore dolore magna aliqua.ullamco labor nisi ut aliquip.
2/3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
1/3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt labore.
1/3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt labore.
1/3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt labore.
1/3
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt labore.
1/4
Lorem dolore aliq ullamco labo nisi aliquip.
3/4
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolo magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip commodo consequat aute.
1/4
Labore dolore aliqua ullamco labo nisi ut aliquip duis aute dolor eprehend.
1/4
Labore dolore aliqua ullamco labo nisi ut aliquip duis aute dolor eprehend.
1/4
Labore dolore aliqua ullamco labo nisi ut aliquip duis aute dolor eprehend.
1/4
Labore dolore aliqua ullamco labo nisi ut aliquip duis aute dolor eprehend.
5/6
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolo magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip commodo consequat aute.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.
1/6
Lorem dolore aliq ullamco labo nisi aliquip.