Demo 5: Toggle Buttons Group (Toggle Attribute)

How

Set a toggle pointing to self on each button in the group.

Code

HTML
<div class="button-group" toggle-group="btn">
    <form action="">
        <button type="toggle">left</button>
        <button type="toggle">center</button>
        <button type="toggle">right</button>
    </form>
</div>
CSS
.button-group button {
    cursor: pointer;
    background-color: #d4d4d4;
    border: 2px solid #666;
}

.button-group button:toggle() {
    background-color: #aaa;
    border: 2px solid hotpink;
}

.button-group button:hover {
    background-color: #eee;
}

Demo (by Bramus)

ℹ Your browser does not support CSS Toggles. To cater for this a polyfill has been loaded.