How can we improve the Microsoft Edge developer experience?

:focus-visible

Implement :focus-visible so that fewer developers remove all focus styles https://www.youtube.com/watch?v=ilj2P5-5CjI

230 votes
Vote
Sign in
Check!
(thinking…)
Reset
or sign in with
  • facebook
  • google
    Password icon
    Signed in as (Sign out)
    You have left! (?) (thinking…)
    oliver shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

    3 comments

    Sign in
    Check!
    (thinking…)
    Reset
    or sign in with
    • facebook
    • google
      Password icon
      Signed in as (Sign out)
      Submitting...
      • Anonymous commented  ·   ·  Flag as inappropriate

        @Claude Pache
        Im not entirely sure why you would need an alternative, the problem :focus-visible solves is that most CSS resets does this: :focus { outline: 0; }, which makes it IMPOSSIBLE for keyboard-only users to navigate through a website. Now you can still remove outline for :focus, but show outline for :focus-visible (keyboard focus).

      • Claude Pache commented  ·   ·  Flag as inappropriate

        An alternative is to make the :focus pseudoclass selector match only elements which should have the focus ring, and to provide the developer more control on deciding which elements may receive focus and/or focus ring (today, tabindex might be use for that purpose, but it has the unwanted effect of affecting the tab ordering).

        If I'm recalling right, according to my testings, in IE, the `:focus` selector matches more often than what is generally wanted; but there has been progress in Edge, so that my workaround for preventing *really* unwanted focus styles in IE are no longer needed in Edge or any other modern browser.

      Feedback and Knowledge Base