Skip to content

Instantly share code, notes, and snippets.

@mortendk
Created December 28, 2011 12:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mortendk/1527788 to your computer and use it in GitHub Desktop.
Save mortendk/1527788 to your computer and use it in GitHub Desktop.
css input checkbox
/**
* The first commented line is your dabblet’s title
*/
input[type=checkbox]{
position: absolute;
top: -9999px;
left: -9999px;
}
input[type=checkbox] ~ label { background:red;}
input[type=checkbox] ~ label {
text-indent: -999em;
border:1px solid green;
overflow:hidden;
display:block
width:120px
}
input[type=checkbox]:checked ~ label { background:green;}
input[type=checkbox] ~ label:after { content:"kiss me";}
input[type=checkbox]:checked ~ label:after { content:"hug me";}
label{
text-indent:-999em;
background:pink;
}
<!-- content to be placed inside <body>…</body> -->
<div class="form-item form-type-radio">
<input type="checkbox" id="edit-field-pt-boolean-checkbox-one-und-0" value="0" name="foo">
<label for="edit-field-pt-boolean-checkbox-one-und-0">lick me</label>
</div>
</div>
{"view":"split-vertical","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment