[Solved] CSS Button Highlight post click

by


Here is a fiddle that should do it in pure CSS. You will not be able to use actual buttons. But you can style the label as I have to look like buttons.

NOTE: This will not work properly in older browsers such as IE8

http://jsfiddle.net/ghvst26b/

HTML

<input type="radio" name="Button" class="ButtonState" checked id="Button1" value="1"/>
<label class="Button" for="Button1">Button 1</label>
<input type="radio" name="Button" class="ButtonState" id="Button2" value="2"/>
<label class="Button" for="Button2">Button 2</label>
<input type="radio" name="Button" class="ButtonState" id="Button3" value="3"/>
<label class="Button" for="Button3">Button 3</label>

CSS

.ButtonState{display:none}
.Button{padding:3px; margin:4px; background:#CCC; border:1px solid #333; cursor:pointer;}
.ButtonState:checked + .Button{background:#fff;}

1

solved CSS Button Highlight post click