From e1bb1e3375c4e53b47bf070881683e22e6b03c2b Mon Sep 17 00:00:00 2001 From: root Date: Wed, 1 Jul 2026 01:49:23 +0000 Subject: [PATCH 1/4] fix: exclude iframes from focus-visible auto outline in Preflight Firefox's UA stylesheet already sets iframe:focus-visible { outline-style: none; }, so Preflight's :-moz-focusring { outline: auto; } rule overrides that and applies an unwanted auto outline to focused iframes. Adding :where(:not(iframe)) to the selector preserves the improved focus ring behavior for all other elements while respecting Firefox's native iframe focus styling. Closes #19795 Co-authored-by: Kirk Loretz --- packages/tailwindcss/preflight.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/tailwindcss/preflight.css b/packages/tailwindcss/preflight.css index 753e79ef0d0f..e7dd8ec4ee00 100644 --- a/packages/tailwindcss/preflight.css +++ b/packages/tailwindcss/preflight.css @@ -170,7 +170,7 @@ table { Use the modern Firefox focus style for all focusable elements. */ -:-moz-focusring { +:-moz-focusring:where(:not(iframe)) { outline: auto; } From 005b8bdda69f27196aa95cdf4b2968a3efb36ea4 Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 2 Jul 2026 12:18:02 +0200 Subject: [PATCH 2/4] update test snapshots --- .../@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap | 2 +- packages/tailwindcss/src/__snapshots__/index.test.ts.snap | 2 +- packages/tailwindcss/src/source-maps/source-map.test.ts | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap index d1f4c64ba4ca..6d4823219ceb 100644 --- a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap +++ b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap @@ -110,7 +110,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = ` border-collapse: collapse; } - :-moz-focusring { + :-moz-focusring:where(:not(iframe)) { outline: auto; } diff --git a/packages/tailwindcss/src/__snapshots__/index.test.ts.snap b/packages/tailwindcss/src/__snapshots__/index.test.ts.snap index 04d3311150fb..4a43ae7f9529 100644 --- a/packages/tailwindcss/src/__snapshots__/index.test.ts.snap +++ b/packages/tailwindcss/src/__snapshots__/index.test.ts.snap @@ -226,7 +226,7 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = ` border-collapse: collapse; } - :-moz-focusring { + :-moz-focusring:where(:not(iframe)) { outline: auto; } diff --git a/packages/tailwindcss/src/source-maps/source-map.test.ts b/packages/tailwindcss/src/source-maps/source-map.test.ts index 25399e843898..9238f495fc95 100644 --- a/packages/tailwindcss/src/source-maps/source-map.test.ts +++ b/packages/tailwindcss/src/source-maps/source-map.test.ts @@ -338,8 +338,8 @@ test('source maps trace back to @import location', async ({ expect }) => { ^^^^^^^^^^^^^^^^^^^^^^^^^ CS @ 73:4-29 | ^^^^^^^^^^^^^^^^^^^^^^^^^ CS @ 166:2-27 | 167 } 74 } | - 75 :-moz-focusring { | 173 :-moz-focusring { - ^^^^^^^^^^^^^^^^ CT @ 75:2-18 | ^^^^^^^^^^^^^^^^ CT @ 173:0-16 + 75 :-moz-focusring:where(:not(iframe)) { | 173 :-moz-focusring:where(:not(iframe)) { + ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CT @ 75:2-38 | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CT @ 173:0-36 76 outline: auto; | 174 outline: auto; ^^^^^^^^^^^^^ CU @ 76:4-17 | ^^^^^^^^^^^^^ CU @ 174:2-15 | 175 } From 54d93cb95a5ad10b89baa13cd0c07b11b19867ce Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 2 Jul 2026 12:24:35 +0200 Subject: [PATCH 3/4] update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index a8a0cbc1ab78..e6866fb886c0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Allow `@tailwindcss/cli` in `--watch` mode to use polling with `--poll` when filesystem events are unreliable or unavailable ([#20297](https://github.com/tailwindlabs/tailwindcss/pull/20297)) - Canonicalization: match arbitrary hex colors against theme colors case-insensitively (e.g. `bg-[#fff]` and `bg-[#FFF]` → `bg-white`) ([#20298](https://github.com/tailwindlabs/tailwindcss/pull/20298)) +- Prevent Preflight from overriding Firefox's native `iframe:focus-visible` outline styles ([#20292](https://github.com/tailwindlabs/tailwindcss/pull/20292)) ## [4.3.2] - 2026-06-26 From fb662dbece28469310ae0bac4fa89d168ac71c46 Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 2 Jul 2026 12:33:29 +0200 Subject: [PATCH 4/4] update integration test snapshots --- integrations/cli/index.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/integrations/cli/index.test.ts b/integrations/cli/index.test.ts index e742662bed90..a2b2ee4ab930 100644 --- a/integrations/cli/index.test.ts +++ b/integrations/cli/index.test.ts @@ -2903,7 +2903,7 @@ test( border-color: inherit; border-collapse: collapse; } - :-moz-focusring { + :-moz-focusring:where(:not(iframe)) { outline: auto; } progress {