Learn 'Mobile First' Web Design Using Bootstrap 3 by Rahul A. Sakla - HTML preview

PLEASE NOTE: This is an HTML preview only and some elements such as links or page numbers may be incorrect.
Download the book in PDF, ePub, Kindle for a complete version.

Button Dropdowns

 

10.6 Button Dropdowns

Use any button to trigger a dropdown menu by placing it within a .btn-group and providing the proper menu markup.

 

10.6.1 Button Dropdown

 

img196.png

 

img197.png

img198.png

 

10.6.2 Split Button Dropdowns

Similarly, create split button dropdowns with the same markup changes, only with a separate button.

img199.png

img200.png

img201.png

 

10.6.3 Sizing

Button dropdowns work with buttons of all sizes.

 

img202.png

 

img203.png

img204.png

img205.png

img206.png

img207.png

img208.png

 

10.6.4 Dropup Button

 

img209.png

 

Trigger dropdown menus above elements by adding .dropup to the parent.

img210.png

img211.png

img212.png