I said that my navbars were keyboard accessible in the last update, but I misspoke like a damnable liar. They were only screenreader accessible. The good news is that they should also be keyboard accessible now (for real this time.)
This fix is also tied up in a compatibility issue with Safari on mobile IOS. My dropdown menus make use of the :hover pseudoclass, but this class isn’t called on when a user touches the menu in Safari, and so they don’t appear. This fix helped me a lot. Couldn’t tell you why it works, apart from expanding the inputs from :hover to :active + :focus.
What I can tell you is that, now that menu items can be called on with both tab ( :focus ) and touch ( :active ), all I needed was some creative use of the :focus-within pseudoclass to get the dropdown menus to persist as a user tabs through them. Spicy.
Thanks to pal Harvey for bringing this to my attention, testing the fix, and patiently listening to me rubber ducky it out!
Leave a Reply