This content originally appeared on remy sharp's b:log and was authored by remy sharp's b:log
This one line of CSS solves the problem of a focus ring appearing when the mouse interacts (visually annoying) whilst importantly keeping it for keyboard navigation:
:focus:not(:focus-visible) { outline: none; }
Nice and simple, and bookmarking because I've been using it in more and more projects.
Source: twitter.com
Originally published on Remy Sharp's b:log
This content originally appeared on remy sharp's b:log and was authored by remy sharp's b:log
Print
Share
Comment
Cite
Upload
Translate
Updates
There are no updates yet.
Click the Upload button above to add an update.
APA
MLA
remy sharp's b:log | Sciencx (2020-08-26T10:28:07+00:00) Lea Verou’s outline trick [link]. Retrieved from https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/
" » Lea Verou’s outline trick [link]." remy sharp's b:log | Sciencx - Wednesday August 26, 2020, https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/
HARVARDremy sharp's b:log | Sciencx Wednesday August 26, 2020 » Lea Verou’s outline trick [link]., viewed ,<https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/>
VANCOUVERremy sharp's b:log | Sciencx - » Lea Verou’s outline trick [link]. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/
CHICAGO" » Lea Verou’s outline trick [link]." remy sharp's b:log | Sciencx - Accessed . https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/
IEEE" » Lea Verou’s outline trick [link]." remy sharp's b:log | Sciencx [Online]. Available: https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/. [Accessed: ]
rf:citation » Lea Verou’s outline trick [link] | remy sharp's b:log | Sciencx | https://www.scien.cx/2020/08/26/lea-verous-outline-trick-link/ |
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.