aboutsummaryrefslogtreecommitdiff
path: root/docs/examples/grid.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/examples/grid.html')
-rw-r--r--docs/examples/grid.html104
1 files changed, 0 insertions, 104 deletions
diff --git a/docs/examples/grid.html b/docs/examples/grid.html
deleted file mode 100644
index 14e8ecdf6..000000000
--- a/docs/examples/grid.html
+++ /dev/null
@@ -1,104 +0,0 @@
----
-layout: example
-title: Grid template
----
-
-<!-- Custom styles for this template -->
-<style>
-
- .container {
- padding-left: 15px;
- padding-right: 15px;
- }
-
- h4 {
- margin-top: 25px;
- }
- .row {
- margin-bottom: 20px;
- }
- .row .row {
- margin-top: 10px;
- margin-bottom: 0;
- }
- [class*="col-lg-"] {
- padding-top: 15px;
- padding-bottom: 15px;
- background-color: rgba(185,74,72,.15);
- border: 1px solid rgba(185,74,72,.2);
- }
-</style>
-
-
-<div class="container">
-
- <h2>Bootstrap grids</h2>
- <p class="lead">Basic grid layouts to get you familiar with building within the Bootstrap grid system.</p>
-
- <h4>Three equal columns</h4>
- <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>
-
- <h4>Three unequal columns</h4>
- <div class="row">
- <div class="col-lg-3">.col-lg-3</div>
- <div class="col-lg-6">.col-lg-6</div>
- <div class="col-lg-3">.col-lg-3</div>
- </div>
-
- <h4>Two columns</h4>
- <div class="row">
- <div class="col-lg-8">.col-lg-8</div>
- <div class="col-lg-4">.col-lg-4</div>
- </div>
-
- <h4>Full width, single column</h4>
- <p class="text-warning">No grid classes are necessary for full-width elements.</p>
-
- <h4>Two columns with two nested columns</h4>
- <div class="row">
- <div class="col-lg-8">
- .col-lg-8
- <div class="row">
- <div class="col-lg-6">.col-lg-6</div>
- <div class="col-lg-6">.col-lg-6</div>
- </div>
- </div>
- <div class="col-lg-4">.col-lg-4</div>
- </div>
-
- <h4>Mixed: mobile and desktop</h4>
- <div class="row">
- <div class="col-12 col-lg-8">.col-12 .col-lg-8</div>
- <div class="col-6 col-lg-4">.col-6 .col-lg-4</div>
- </div>
- <div class="row">
- <div class="col-6 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-lg-4">.col-6 .col-lg-4</div>
- </div>
- <div class="row">
- <div class="col-6 col-lg-6">.col-6 .col-lg-6</div>
- <div class="col-6 col-lg-6">.col-6 .col-lg-6</div>
- </div>
-
- <h4>Mixed: mobile, tablet, and desktop</h4>
- <div class="row">
- <div class="col-12 col-sm-8 col-lg-8">.col-12 .col-lg-8</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- </div>
- <div class="row">
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- </div>
- <div class="row">
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
- </div>
-
-
-</div> <!-- /container -->