I\'ve been searching for a good trick to make a Hide/Show content or a list with only CSS and no javascript. I\'ve managed to make this action:
I wouldn't use checkboxes, i'd use the code you already have
DEMO http://jsfiddle.net/6W7XD/1/
CSS
body {
display: block;
}
.span3:focus ~ .alert {
display: none;
}
.span2:focus ~ .alert {
display: block;
}
.alert{display:none;}
HTML
Hide Me
Show Me
Some alarming information here
This way the text is only hidden on click of the hide element