by
0
4
1,712
2
Top 1% !
Popular
Famous
Specified
Popularity: 12469th place
Created
Modified Jun 29, 2013

Published on:

No tags for this snippet yet.
LanguageCSS
LanguageHTML
LanguageJSON
LicenseMIT_X11
SourceGithub

Checkbox Hack

Checkbox Hack: 
dabblet.css
dabblet.html
settings.json
Copy Embed Code
<iframe id="embedFrame" style="width:600px; height:300px;"
src="https://www.snip2code.com/Embed/2902/Checkbox-Hack?startLine=0"></iframe>
Click on the embed code to copy it into your clipboard Width Height
Leave empty to retrieve all the content Start End
/* Checkbox Hack */ input[type=checkbox] { position: absolute; top: -9999px; left: -9999px; } label { -webkit-appearance: push-button; -moz-appearance: button; display: inline-block; margin: 60px 0 10px 0; cursor: pointer; } /* Default State */ div { background: green; width: 400px; height: 100px; line-height: 100px; color: white; text-align: center; } /* Toggled State */ input[type=checkbox]:checked ~ div { background: red; } <label for="toggle-1">I'm a toggle</label> <input type="checkbox" id="toggle-1"> <div>I'm controlled by toggle. No JavaScript!</div> {"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
If you want to be updated about similar snippets, Sign in and follow our Channels
Originally posted on https://gist.github.com/5892767