Dropdown

An implementation of a pure CSS, clickable dropdown. From Stack Overflow.

It works by creating a focusable div, with CSS rules to show a list of links when focused. There is another focusable element that can "steal" the focus, when a second click arises. Some limitations: Using tab to select it doesn't work (if we allow that with e.g. `tabindex=1`, then a second tab closes it without moving to the next focusable element ("Log in" here). The menu doesn't close when hitting Escape. It's possible to select part of the text (Playground here, maybe it is solvable by better dimensioning the link within the div).



In action: Refli homepage.

In action: Refli homepage (constant ratio).