diff options
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/_includes/js/modal.html | 86 |
1 files changed, 41 insertions, 45 deletions
diff --git a/docs/_includes/js/modal.html b/docs/_includes/js/modal.html index bdecb1eff..7e0a427ef 100644 --- a/docs/_includes/js/modal.html +++ b/docs/_includes/js/modal.html @@ -219,7 +219,7 @@ $('#myModal').on('shown.bs.modal', function () { {% endhighlight %} <h2 id="modals-grid-system">Using the grid system</h2> - <p>To take advantage of the Bootstrap grid system within a modal, just nest <code>.container-fluid</code> within the <code>.modal-body</code> and then use the normal grid system classes within this container.</p> + <p>To take advantage of the Bootstrap grid system within a modal, just nest <code>.row</code>s within the <code>.modal-body</code> and then use the normal grid system classes.</p> <!-- sample modal content --> <div id="gridSystemModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridModalLabel"> <div class="modal-dialog" role="document"> @@ -229,28 +229,26 @@ $('#myModal').on('shown.bs.modal', function () { <h4 class="modal-title" id="gridModalLabel">Modal title</h4> </div> <div class="modal-body"> - <div class="container-fluid"> - <div class="row"> - <div class="col-md-4">.col-md-4</div> - <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> - </div> - <div class="row"> - <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> - <div class="col-md-2 col-md-offset-4">.col-md-2 .col-md-offset-4</div> - </div> - <div class="row"> - <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> - </div> - <div class="row"> - <div class="col-sm-9"> - Level 1: .col-sm-9 - <div class="row"> - <div class="col-xs-8 col-sm-6"> - Level 2: .col-xs-8 .col-sm-6 - </div> - <div class="col-xs-4 col-sm-6"> - Level 2: .col-xs-4 .col-sm-6 - </div> + <div class="row"> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> + </div> + <div class="row"> + <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> + <div class="col-md-2 col-md-offset-4">.col-md-2 .col-md-offset-4</div> + </div> + <div class="row"> + <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> + </div> + <div class="row"> + <div class="col-sm-9"> + Level 1: .col-sm-9 + <div class="row"> + <div class="col-xs-8 col-sm-6"> + Level 2: .col-xs-8 .col-sm-6 + </div> + <div class="col-xs-4 col-sm-6"> + Level 2: .col-xs-4 .col-sm-6 </div> </div> </div> @@ -277,28 +275,26 @@ $('#myModal').on('shown.bs.modal', function () { <h4 class="modal-title" id="gridSystemModalLabel">Modal title</h4> </div> <div class="modal-body"> - <div class="container-fluid"> - <div class="row"> - <div class="col-md-4">.col-md-4</div> - <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> - </div> - <div class="row"> - <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> - <div class="col-md-2 col-md-offset-4">.col-md-2 .col-md-offset-4</div> - </div> - <div class="row"> - <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> - </div> - <div class="row"> - <div class="col-sm-9"> - Level 1: .col-sm-9 - <div class="row"> - <div class="col-xs-8 col-sm-6"> - Level 2: .col-xs-8 .col-sm-6 - </div> - <div class="col-xs-4 col-sm-6"> - Level 2: .col-xs-4 .col-sm-6 - </div> + <div class="row"> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div> + </div> + <div class="row"> + <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div> + <div class="col-md-2 col-md-offset-4">.col-md-2 .col-md-offset-4</div> + </div> + <div class="row"> + <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div> + </div> + <div class="row"> + <div class="col-sm-9"> + Level 1: .col-sm-9 + <div class="row"> + <div class="col-xs-8 col-sm-6"> + Level 2: .col-xs-8 .col-sm-6 + </div> + <div class="col-xs-4 col-sm-6"> + Level 2: .col-xs-4 .col-sm-6 </div> </div> </div> |