I just learned about the
The way this works is brilliant. The hamburger icon is a link to
#main-menu. When clicked, the URL changes to have the fragment
#main-menu without reloading the page, as fragment changes don’t trigger a reload. The element with the id
main-menu is normally positioned 200px left of the page, so that it’s hidden, but
#main-menu:target is positioned on the page, so as that URL fragment changes, the menu appears. The menu can be closed by clicking a link that doesn’t have that fragment, thereby making the menu disappear.