Bootstrap 2 Radio Buttons

How to use regular radio buttons with the bootstrap 2 radio effect.

by TheOrdinaryGeek

HTML

<div class="btn-group" data-toggle="buttons-radio">
    <label for="leftradio" class="btn btn-primary">Left</label>
    <input type="radio" name="button" value="left" id="leftradio" />
    <label for="middleradio" class="btn btn-primary">Middle</label>
    <input type="radio" name="button" value="middle" id="middleradio" />
    <label for="rightradio" class="btn btn-primary">Right</label>
    <input type="radio" name="button" value="right" id="rightradio" />
</div>

CSS

.btn-group > input[type=radio] {
    display: none;
}

.btn-group > label.btn.active {
    color: black;
    background-color: yellow;
}