diff --git a/CHANGELOG.md b/CHANGELOG.md index 4449f460368e..e0887e203e63 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -34,6 +34,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Ensure the CSS `theme()` function handles newlines and tabs in its arguments list ([#14917](https://github.com/tailwindlabs/tailwindcss/pull/14917)) - Don't unset keys like `--inset-shadow-*` when unsetting keys like `--inset-*` ([#14906](https://github.com/tailwindlabs/tailwindcss/pull/14906)) - Ensure spacing utilities with no value (e.g. `px` or `translate-y`) don't generate CSS ([#14911](https://github.com/tailwindlabs/tailwindcss/pull/14911)) +- Don't override user-agent background color for input elements in Preflight ([#14913](https://github.com/tailwindlabs/tailwindcss/pull/14913)) - Don't attempt to convert CSS variables (which should already be percentages) to percentages when used as opacity modifiers ([#14916](https://github.com/tailwindlabs/tailwindcss/pull/14916)) - _Upgrade (experimental)_: Install `@tailwindcss/postcss` next to `tailwindcss` ([#14830](https://github.com/tailwindlabs/tailwindcss/pull/14830)) - _Upgrade (experimental)_: Remove whitespace around `,` separator when print arbitrary values ([#14838](https://github.com/tailwindlabs/tailwindcss/pull/14838)) diff --git a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap index 24d0c8fa484d..ad9c3ff71f41 100644 --- a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap +++ b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap @@ -467,7 +467,6 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = ` font-variation-settings: inherit; letter-spacing: inherit; color: inherit; - background: none; } ::file-selector-button { @@ -476,7 +475,6 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = ` font-variation-settings: inherit; letter-spacing: inherit; color: inherit; - background: none; } input:where(:not([type="button"], [type="reset"], [type="submit"])), select, textarea { @@ -485,10 +483,12 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = ` button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; + background: none; } ::file-selector-button { appearance: button; + background: none; } :-moz-focusring { diff --git a/packages/tailwindcss/preflight.css b/packages/tailwindcss/preflight.css index 6e57b9faadf3..cafbaffb100f 100644 --- a/packages/tailwindcss/preflight.css +++ b/packages/tailwindcss/preflight.css @@ -175,8 +175,7 @@ table { } /* - 1. Inherit the font styles in all browsers. - 2. Remove the default background color. + Inherit font styles in all browsers. */ button, @@ -185,12 +184,11 @@ optgroup, select, textarea, ::file-selector-button { - font: inherit; /* 1 */ - font-feature-settings: inherit; /* 1 */ - font-variation-settings: inherit; /* 1 */ - letter-spacing: inherit; /* 1 */ - color: inherit; /* 1 */ - background: transparent; /* 2 */ + font: inherit; + font-feature-settings: inherit; + font-variation-settings: inherit; + letter-spacing: inherit; + color: inherit; } /* @@ -204,12 +202,15 @@ textarea { } /* - Correct the inability to style the border radius in iOS Safari. + 1. Remove the default background color of buttons by default. + 2. Correct the inability to style the border radius in iOS Safari. */ + button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button { - appearance: button; + background: transparent; /* 1 */ + appearance: button; /* 2 */ } /*