Bootstrap Buttons Groups

 
  •     .btn-group class is used to make a group of buttons.
  •     .btn-group-lg can be used to make button large.
  •     .btn-group-justified used to cover entire span of screen.
  •     .btn-group-vertical used to make buttons vertical.
 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Bootstrap Button Example</title> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> </head> <body> <h1>Button Groups</h1> <div class="btn-group"> <button type="button" class="btn btn-primary">Button1</button> <button type="button" class="btn btn-default">Button2</button> <button type="button" class="btn btn-warning">Button3</button> <button type="button" class="btn btn-danger">Button4</button> </div></br></br> <div class="btn-group btn-group-lg"> <button type="button" class="btn btn-primary">Button1</button> <button type="button" class="btn btn-default">Button2</button> <button type="button" class="btn btn-warning">Button3</button> <button type="button" class="btn btn-danger">Button4</button> </div></br></br> <div class="btn-group-justified"> <a href="#" class="btn btn-primary">Button1</a> <a href="#" class="btn btn-default">Button2</a> <a href="#" class="btn btn-warning">Button3</a> <a href="#" class="btn btn-danger">Button4</a> </div></br></br> <div class="btn-group-vertical"> <button class="btn btn-primary">Button1</button> <button class="btn btn-default">Button2</button> <button class="btn btn-warning">Button3</button> <button class="btn btn-danger">Button4</button> </div> </body> </html>
Output