(Are a browser’s heuristics perfect at determining the input? That depends. :focus-visible accomplishes the same thing as :focus, but uses a browser’s knowledge of user inputs (or heuristics) to determine whether the focus is coming from a keyboard or a mouse. The strategy has largely been an all-or-nothing choice between using a custom outline when any element is in :focus (great, but that means for both keyboard tabbing and mouse clicks) or ditching the outline altogether (not great, like ever). It’s sort of a happy medium between loving the outline for accessibility purposes (gotta know what element is selected when tabbing on a keyboard) but not-really-loving how it looks (gotta have everything follow brand). What’s so cool about :focus-visible? It’s all about the blue focus ring that displays around elements that are in focus. ![]() I had to rush over to the MDN Docs just to confirm, and yep, the :focus-visible page has been updated to reflect the news. ![]() Look at that! The :focus-visible pseudo-selector is now supported in Firefox, as of version 85 which shipped yesterday.
0 Comments
Leave a Reply. |