Skip to content

Instantly share code, notes, and snippets.

@g12n
Created December 13, 2012 07:16
Show Gist options
  • Save g12n/4274710 to your computer and use it in GitHub Desktop.
Save g12n/4274710 to your computer and use it in GitHub Desktop.
Multilevel Cheklists with :checked
/**
* Multilevel Cheklists with :checked
*/
.checklist{
list-style:none;
padding:0
}
.checklist ul{
list-style:none;
padding:0 0 0 1em;
display:none;
}
.checklist [type=checkbox]:checked ~ ul {
display:block;
}
.checklist [type=checkbox]:checked ~ label {
font-weight: bold;
}
<!-- content to be placed inside <body>…</body> -->
<ul class="checklist">
<li>
<input type="checkbox" name="newsletter" id="newsletter" value="1" class="checkbox">
<label for="newsletter" class="checkLabel">I want fun …</label>
<ul>
<li>
<input type="checkbox" name="winter" id="winter" value="1" class="checkbox">
<label for="winter" class="checkLabel">… in the Winter</label>
</li>
<li>
<input type="checkbox" name="summer" id="summer" value="1" class="checkbox">
<label for="summer" class="checkLabel">… in the Summer</label>
</li>
</ul>
</li>
</ul>
// alert('Hello world!');
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment