diff options
| author | Mark Otto <[email protected]> | 2012-03-10 13:40:58 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2012-03-10 13:40:58 -0800 |
| commit | dd5cffc308f9c990ed40be074c864d0ed563ef12 (patch) | |
| tree | 1c6eb4a16d7408efc4f0ddf9c75128629df8a43b /docs/components.html | |
| parent | c7eb1ab49a585b58f2ef8ec8450a704cb5e0172c (diff) | |
| download | bootstrap-dd5cffc308f9c990ed40be074c864d0ed563ef12.tar.xz bootstrap-dd5cffc308f9c990ed40be074c864d0ed563ef12.zip | |
add button sizes to docs for button dropdowns, clean up styles for them
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/docs/components.html b/docs/components.html index 809f4d40e..767a8474d 100644 --- a/docs/components.html +++ b/docs/components.html @@ -289,6 +289,50 @@ </pre> </div> </div> + <div class="row"> + <div class="span4"> + <h3>Works with all button sizes</h3> + <p>Button dropdowns work at any size. your button sizes to <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code>.</p> + <div class="btn-toolbar" style="margin-top: 18px;"> + <div class="btn-group"> + <button class="btn btn-large dropdown-toggle" data-toggle="dropdown">Large button <span class="caret"></span></button> + <ul class="dropdown-menu"> + <li><a href="#">Action</a></li> + <li><a href="#">Another action</a></li> + <li><a href="#">Something else here</a></li> + <li class="divider"></li> + <li><a href="#">Separated link</a></li> + </ul> + </div><!-- /btn-group --> + <div class="btn-group"> + <button class="btn btn-small dropdown-toggle" data-toggle="dropdown">Small button <span class="caret"></span></button> + <ul class="dropdown-menu"> + <li><a href="#">Action</a></li> + <li><a href="#">Another action</a></li> + <li><a href="#">Something else here</a></li> + <li class="divider"></li> + <li><a href="#">Separated link</a></li> + </ul> + </div><!-- /btn-group --> + <div class="btn-group"> + <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown">Mini button <span class="caret"></span></button> + <ul class="dropdown-menu"> + <li><a href="#">Action</a></li> + <li><a href="#">Another action</a></li> + <li><a href="#">Something else here</a></li> + <li class="divider"></li> + <li><a href="#">Separated link</a></li> + </ul> + </div><!-- /btn-group --> + </div><!-- /btn-toolbar --> + </div><!--/span--> + <div class="span4"> + + </div><!--/span--> + <div class="span4"> + + </div><!--/span--> + </div><!--/row--> <div class="alert alert-info"> <strong>Heads up!</strong> In some cases—like mobile—dropdown menus will extend outside the viewport. You need to resolve the alignment manually or with custom javascript. </div> |