Bootstrap 4 – Responsive Web Design

Checkbox and radio buttons

A new feature in Bootstrap 4 is the ability to convert checkboxes and radio buttons into regular buttons. This is really handy from a mobile standpoint because it is much easier to touch a button than it is to check a box or tap a radio button. If you are building a mobile app or responsive website, it would be a good idea to use this component. Let's start by taking a look at the code to generate a group of three checkboxes as a button group:

<div class="btn-group" data-toggle="buttons"> <label class="btn btn-primary active"> <input type="checkbox" checked autocomplete="off"> checkbox 1 </label> <label class="btn btn-primary"> <input type="checkbox" autocomplete="off"> checkbox 2 </label> <label class="btn btn-primary"> ...