diff options
| author | Mark Otto <[email protected]> | 2015-08-04 19:57:49 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2015-08-04 19:57:49 -0700 |
| commit | f9bee7deb6564234294925bd7480b93060b6d5a9 (patch) | |
| tree | a8b2619a8b74d39b0e3180923b0e4b0af34f29cb /docs/_includes | |
| parent | cf2d9bfe8ad8ef7cfc0d8c800cae0e4d4c03934d (diff) | |
| download | bootstrap-f9bee7deb6564234294925bd7480b93060b6d5a9.tar.xz bootstrap-f9bee7deb6564234294925bd7480b93060b6d5a9.zip | |
fixes #16902: remove the .container-fluid from the grid system in modal example since it's doubling up padding
Diffstat (limited to 'docs/_includes')
| -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> |