How to horizontal radioboxes or checkboxes

Hi,

Any idea how to align radio or checkboxes on one line (horizontally) in form?

see html below:

Titel
                                    </label>
            </div>
                    <div class="form-data " data-grav-field="radio" data-grav-disabled="true" data-grav-default="&quot;markdown&quot;">
                                            
    <div class="radio  ">
        <input type="radio" value="dhr" id="titelmv-dhr" name="data[titelmv]">
        <label style="display: inline" class="inline" for="titelmv-dhr">Dhr.</label>
    </div>
        
    <div class="radio  ">
        <input type="radio" value="mevr" id="titelmv-mevr" name="data[titelmv]">
        <label style="display: inline" class="inline" for="titelmv-mevr">Mevr.</label>
    </div>
                                
        </div>
        </div>

Did you try putting both inputs and their respective labels in one div with the radio class? It works html wise.

Well this can be done with some CSS.

.radio { display: inline-block }
1 Like