You can conditionally style elements based on an input checkbox's `checked` state. A label element can also toggle an input checkbox's `checked state`, but cont

You can conditionally style elements based on an input checkbox's `checked` state. A label element can also toggle an input checkbox's `checked state`, but contain whatever HTML you want. Put the two together and you can do interactive elements without JS: ``` <input id="inputId" type="checkbox" /> <label for="inputId"></label> <div class="toggle-content">Some DOM</div> ``` ``` label::after{ display: block; content: '[+]'; } #input, .toggle-content { display: none; } #input:checked + label::after { content: '[-]'; } #input:checked ~ .toggle-content { display: block; } ``` Off the top of my head, so YMMV but principal is all there. You start getting headaches if you want animate that though (keyframes that animate a max-height from 0 to 9999999px goes some of the way but feels a bit hacky/doesn't give you much control over consistent timing.)