Radio button

Definition: A radio button is an element that selects one option from a predefined set of options.

Design

Add your <input> to the wrapper that contain the .radio class. Add a <label> label tag after the <input> tag.


                                                        
                                                        
                                                            <div class="radio">
                                                          <input type="radio" id="radio-example-1"> 
                                                          <label for="radio-example-1">Option one is this</label>
                                                        </div>
                                                        
                                                            

 

Secondary/outline style

For the secondary style of the checkbox just add the .radio-outline class to the .radio wrapper.


                                                        
                                                        
                                                            <div class="radio radio-outline">
                                                          <input type="radio" id="radio-example-1"> 
                                                          <label for="radio-example-1">Option one is this</label>
                                                        </div>