diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css index 1b83dc997..e37c560bf 100644 --- a/__tests__/fixtures/tailwind-output-important.css +++ b/__tests__/fixtures/tailwind-output-important.css @@ -488,6 +488,22 @@ h6 { font-weight: inherit; } +/** + * Inherit color, font-weight, and line-height from the parent + * so that form elements don't inadvertently have any styles + * that deviate from your design system. + */ + +button, +input, +optgroup, +select, +textarea { + color: inherit; + font-weight: inherit; + line-height: inherit; +} + .container { width: 100%; } diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css index 1aab26175..da8803c5b 100644 --- a/__tests__/fixtures/tailwind-output.css +++ b/__tests__/fixtures/tailwind-output.css @@ -488,6 +488,22 @@ h6 { font-weight: inherit; } +/** + * Inherit color, font-weight, and line-height from the parent + * so that form elements don't inadvertently have any styles + * that deviate from your design system. + */ + +button, +input, +optgroup, +select, +textarea { + color: inherit; + font-weight: inherit; + line-height: inherit; +} + .container { width: 100%; } diff --git a/src/plugins/css/preflight.css b/src/plugins/css/preflight.css index af4c3dc12..0a76210f9 100644 --- a/src/plugins/css/preflight.css +++ b/src/plugins/css/preflight.css @@ -133,3 +133,18 @@ h6 { font-size: inherit; font-weight: inherit; } + +/** + * Inherit color, font-weight, and line-height from the parent + * so that form elements don't inadvertently have any styles + * that deviate from your design system. + */ +button, +input, +optgroup, +select, +textarea { + color: inherit; + font-weight: inherit; + line-height: inherit; +}