Bootstrap Grid System
Ex.
News
Scientists may soon be able to tease out a faint signal of gravitational waves from black hole collisions too distant to be detected directly, scientists with LIGO, the Advanced Laser Interferometer Gravitational-Wave Observatory.
Activities
Half Lava & Half Rock, 5 Cancri E Might Be The Weirdest Exoplanet Ever Discovered
Bootstrap's grid system allows up to 12 columns across the page
device Responsive
- xs -> Extra small screen(phone)
- sm -> small screen(tablet)
- md -> medium screen(desktop)
- lg -> large screen(large LCD)
Change the browser width and observe change in width of columns of below grids according to brower size
1
1
1
1
1
1
1
1
1
1
1
1
offset
<div class="container">
<div class="row ">
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
<div class="col-xs-1 col-sm-1 col-md-1">1</div>
</div>
<br>
<div class="row">
<div class="col-xs-8 col-sm-6 col-md-3 col-lg-1">xs-8, sm-6, md-3</div>
<div class="col-xs-4 col-sm-6 col-md-9 col-lg-11">xs-4, sm-6, md-9</div>
</div>
<br>
<div class="row">
<div class="col-md-8 col-md-offset-3 col-sm-8 col-sm-offset-3">offset</div>
</div>
</div>