-moz-user-focus: Browser Support, Values, Alternatives

What is -moz-user-focus?

-moz-user-focus is a Mozilla-prefixed, non-standard CSS property that told Gecko whether an element could accept keyboard focus. It accepted normal, ignore, or none, and it was never part of any W3C specification. The W3C CSS Working Group rejected the predecessor user-focus proposal during the CSS3 UI draft phase.

Which browsers does -moz-user-focus support?

Only Firefox on desktop ever supported -moz-user-focus, and only from Firefox 2 to Firefox 121. Firefox 122 and later removed it, and no other browser engine ever shipped it.

What are the valid values of -moz-user-focus?

-moz-user-focus accepted three keyword values plus the standard CSS-wide keywords. Each keyword changed how Gecko routed keyboard focus and click activation for the matching element.

• none: The initial value. The element refused keyboard focus, and selecting it stripped focus from any other element on the page. This was the default for elements that had no explicit -moz-user-focus rule.
• normal: The element accepted keyboard focus and behaved like a normal focusable element in the tab order.
• ignore: The element refused keyboard focus and was skipped in the tab sequence, but it did not strip focus from other elements when activated. This was the most common value used in real codebases.
• inherit: The element copied the computed -moz-user-focus value from its parent.
• initial: The element reset to the initial value, which is none.
• unset: The element reset to inherit if -moz-user-focus is inherited, or to the initial value otherwise. Because -moz-user-focus is not inherited, unset behaved the same as initial.

What are the standard alternatives to -moz-user-focus?

Every -moz-user-focus use case has a standard, cross-browser replacement that works on Chrome, Edge, Firefox, Safari, and Opera. Pick the alternative that matches the focus rule you were targeting.

• tabindex="-1": The HTML attribute that removes an element from the sequential tab order while still allowing programmatic focus through element.focus(). It is the direct replacement for -moz-user-focus: ignore.
• inert attribute: The HTML attribute that makes an element and its entire subtree unfocusable, unclickable, and invisible to assistive technology. It is the cleanest replacement when you need to disable a whole region.
• disabled attribute: The HTML attribute on form controls like button, input, select, and textarea. It blocks focus, blocks pointer events, and reflects the disabled state to assistive technology.
• pointer-events: none: The CSS property that blocks mouse and touch activation. Pair it with tabindex="-1" to also remove keyboard focus, since pointer-events alone does not change tab order.
• aria-hidden="true": The ARIA attribute that hides an element from accessibility trees. Combine it with inert or tabindex="-1" because aria-hidden alone does not block focus.
• JavaScript focus management: A blur() call inside a focus event listener mirrors the original -moz-user-focus: none behavior of refusing focus on every interaction.

Here is a side-by-side migration from a Firefox-only -moz-user-focus rule to a cross-browser equivalent that works on every modern engine:

/* Legacy Firefox-only rule. Worked in Firefox 2 to 121. */
.skip-focus {
  -moz-user-focus: ignore;
}

/* Cross-browser replacement. Works everywhere. */
<button class="skip-focus" tabindex="-1">Not focusable</button>

/* Or, to skip a whole subtree: */
<div inert>
  <button>Not focusable</button>
  <input type="text" placeholder="Not focusable" />
</div>

What are the known issues with -moz-user-focus?

Most -moz-user-focus problems come from the same root cause: it only ever worked in Firefox, and now it does not work even there. The issues below catch the surprises that real codebases hit during the migration.

• Silent removal in Firefox 122: Firefox 122 dropped the property without a console warning, so a UI that relied on -moz-user-focus: ignore to skip a custom widget suddenly becomes focusable on current Firefox builds. Bugzilla 1871745 tracked the regression that surfaced this for inputs.
• Never worked outside Firefox: Any rule that targets -moz-user-focus has always been dead on Chrome, Edge, Safari, Opera, Samsung Internet, and Internet Explorer. A developer testing only on Firefox can ship a focus bug that lands the moment a user opens the page on Chrome.
• No automatic fallback to standard properties: Browsers do not map -moz-user-focus: ignore to tabindex="-1" automatically. The HTML attribute and the CSS rule live in different layers, so the migration has to be explicit.
• Conflicts with inert and tabindex: Stacking -moz-user-focus: ignore on top of inert or tabindex="-1" inside Firefox 121 produced conflicting focus paths and edge cases that varied by element type, which is part of why Mozilla cleaned the property out.
• XUL leak into HTML: -moz-user-focus was originally a XUL-only concept that leaked into HTML through Gecko's shared style system. Many of the documented quirks came from XUL-specific behavior that never made sense on HTML elements.
• Linting tools still flag it: stylelint and ESLint stylelint-config-recommended both still permit -moz-user-focus by default. Add a custom rule that bans the property to keep dead Firefox-only CSS out of new code.

In my experience, the cleanest way to migrate a legacy codebase is a single grep for -moz-user-focus across every CSS file, then swap each match for tabindex="-1" or inert based on whether the rule was ignore or none. The HTML attribute path is more reliable than any CSS approach, because it survives the Firefox 122 removal and works on every other browser at the same time.

Citations

All -moz-user-focus version numbers and platform notes in this guide come from these primary sources:

• MDN Web Docs - -moz-user-focus: developer.mozilla.org/en-US/docs/Web/CSS/-moz-user-focus
• MDN Web Docs - Mozilla Extensions: developer.mozilla.org/en-US/docs/Web/CSS/Mozilla_Extensions
• MDN Web Docs - tabindex: developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
• MDN Web Docs - inert attribute: developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inert
• Bugzilla 1868552 - -moz-user-focus handling is a mess: bugzilla.mozilla.org/show_bug.cgi?id=1868552
• Bugzilla 1871745 - Inputs styled with -moz-user-focus: none no longer focusable: bugzilla.mozilla.org/show_bug.cgi?id=1871745
• WHATWG HTML - focusable area definitions: html.spec.whatwg.org/multipage/interaction.html#focusable-area
• W3C CSS UI Module Level 3: w3.org/TR/css-ui-3
• Wikipedia - Cascading Style Sheets: en.wikipedia.org/wiki/Cascading_Style_Sheets