How to track click on the button without JS?

How to track click on the button without JS?
When you click on the grey square, the block should change width, the square will become red. How to do this without JS?

5df0e6af1bfd2882836628.png
April 3rd 20 at 17:30
2 answers
April 3rd 20 at 17:32
Solution
For example, use a checkbox (stylize if needed). Example
instead of the square should be an icon you want to change on click, is it possible? - jayda.Stant commented on April 3rd 20 at 17:35
@jayda.Stant, maybe. Any child element of the label, i.e. the neighbor checkbox. Then in the css will change it, for example:
.checkbox_elem:checked ~ .square { background: red }
- sigurd84 commented on April 3rd 20 at 17:38
https://jsfiddle.net/nb9y3kom/1/
Why is not working? - jayda.Stant commented on April 3rd 20 at 17:41
@sigurd84, tell me why is not working?
https://jsfiddle.net/nb9y3kom/1/ - jayda.Stant commented on April 3rd 20 at 17:44
April 3rd 20 at 17:34
Solution
Can block to make as label inside it input checkbox and the styles is bound to the checked state of the input.
https://jsfiddle.net/nb9y3kom/1/
Can you know why? - jayda.Stant commented on April 3rd 20 at 17:37
No, the label can appear after the checkbox and be associated with him through an attribute of the odds. - Eldon.Yost commented on April 3rd 20 at 17:40

Find more questions by tags CSSHTML