Search code examples
cssfirefoxcheckboxradio-button

How to remove the focus-visible styles around checkboxes/radio buttons in Firefox 89+ (Proton)?


Pretty much the same question as this:
How to remove unnecessary blue outlines of focused checkbox in Mozilla Firefox 89

But:
Navigating a form with a keyboard (using the TAB key) still shows the same styles around checkboxes/radio buttons.
These styles ought to be :focus-visible styles, but the following does not remove them:

[type="checkbox"]:focus-visible,
[type="radio"]:focus-visible {
    outline: 0;
}

I also tried removing any box-shadow, border and all of that with !important.
No luck.

Is there a CSS solution to remove these new Firefox styles around keyboard focused checkboxes/radio buttons?


Solution

  • This seems to have been fixed. In Firefox 92 the following CSS once again removes the focus-visible styles around checkboxes/radio buttons as expected:

    :focus {
        outline: 0;
    }