Skip to content

Instantly share code, notes, and snippets.

@max
Created May 13, 2012 18:36
Show Gist options
  • Save max/2689677 to your computer and use it in GitHub Desktop.
Save max/2689677 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<meta charset="utf-8">
<title>Radio Buttons</title>
<style>
input[type=radio] {
height: 16px;
opacity: 0;
position: absolute;
width: 16px;
}
label {
background: url("http://cl.ly/2N2R3X0O2u1K2Z2m1g1E/content#.png") no-repeat;
display: inline-block;
line-height: 16px;
padding-left: 21px;
}
input[type=radio]:checked + label {
background-position: 0 -16px;
}
</style>
<p>
<input id="my-radio-one" name="my-radio" type="radio">
<label for="my-radio-one">Radio Button</label>
</p>
<p>
<input id="my-radio-two" name="my-radio" type="radio">
<label for="my-radio-two">Radio Button</label>
</p>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment