Radio

The radio class is a simple wrapper around the <input type="radio"> HTML elements. It is intentionally not styled, to preserve cross-browser compatibility and the user experience.

Make sure the linked radio buttons have the same value for their name HTML attribute.

<div class="field">
    <label class="radio">
        <input type="radio" name="choices" value="1" id="opt1">
        Option 1
    </label>
    <label class="radio">
        <input type="radio" name="choices" value="2" id="opt2">
        Option 2
    </label>
</div>

Status

<div class="field">
    <label class="radio">
        <input type="radio" name="choices" value="1" id="opt1">
        Option 1
    </label>
    <label class="radio">
        <input type="radio" name="choices" value="2" id="opt2">
        Option 2
    </label>
    <label class="radio" disabled>
        <input type="radio" name="choices" value="3" id="opt3" disabled>
        Disabled option
    </label>
</div>
← Elements →