A pure CSS click toggle
Making a drop down menu I thought would be more challenging than this. Turns out that it is quite simple.
For this experiment you will need:
- 2 divs
- 1 input[type=checkbox]
- 2 labels
- 1 a
We will make the labels trigger the checkbox and the css will identify the checkbox as checked. The elements after the checked checkbox will have their own properties. Also we will make a bigger label on the background to trigger the close.
Ok, but how?
Check it on CodePen.io, I made an effort to comment as much as I could.
Hope it’s useful for you as much as it was for me!