diff options
Diffstat (limited to 'docs/examples/grid')
| -rw-r--r-- | docs/examples/grid/index.html | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/docs/examples/grid/index.html b/docs/examples/grid/index.html index e07417c44..bf50845aa 100644 --- a/docs/examples/grid/index.html +++ b/docs/examples/grid/index.html @@ -28,6 +28,39 @@ <p class="lead">Basic grid layouts to get you familiar with building within the Bootstrap grid system.</p> </div> + <h3>Five grid tiers</h3> + <p>There are five tiers to the Bootstrap grid system, one for each range of devices we support. Each tier starts at a minimum viewport size and automatically applies to the larger devices unless overridden.</p> + +<div class="row"> + <div class="col-xs-4">.col-xs-4</div> + <div class="col-xs-4">.col-xs-4</div> + <div class="col-xs-4">.col-xs-4</div> +</div> + +<div class="row"> + <div class="col-sm-4">.col-sm-4</div> + <div class="col-sm-4">.col-sm-4</div> + <div class="col-sm-4">.col-sm-4</div> +</div> + +<div class="row"> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4">.col-md-4</div> +</div> + +<div class="row"> + <div class="col-lg-4">.col-lg-4</div> + <div class="col-lg-4">.col-lg-4</div> + <div class="col-lg-4">.col-lg-4</div> +</div> + +<div class="row"> + <div class="col-xl-4">.col-xl-4</div> + <div class="col-xl-4">.col-xl-4</div> + <div class="col-xl-4">.col-xl-4</div> +</div> + <h3>Three equal columns</h3> <p>Get three equal-width columns <strong>starting at desktops and scaling to large desktops</strong>. On mobile devices, tablets and below, the columns will automatically stack.</p> <div class="row"> |