Repository: tailwindlabs/tailwindcss
Pull request #2729 (2020-11-03 20:54:44)

Don't explicitly set font/line-height on body, inherit from html instead
Previously we were setting the font and line-height on the `body` tag explicitly because of an override to `body` happening in modern-normalize, but I think this is actually a simpler change and makes things behave more like people expect coming from Tailwind v1.x.

codecov-io: # [Codecov](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=h1) Report
> Merging [#2729](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=desc) into [master](https://codecov.io/gh/tailwindlabs/tailwindcss/commit/84d57aed6d9697f5da49713c20f096a451814813?el=desc) will **not change** coverage.
> The diff coverage is `n/a`.

[![Impacted file tree graph](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729/graphs/tree.svg?width=650&height=150&src=pr&token=bY4d7WZ54r)](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=tree)

```diff
@@           Coverage Diff           @@
##           master    #2729   +/-   ##
=======================================
  Coverage   93.03%   93.03%           
=======================================
  Files         172      172           
  Lines        1737     1737           
  Branches      312      312           
=======================================
  Hits         1616     1616           
  Misses        104      104           
  Partials       17       17           
```



------

[Continue to review full report at Codecov](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=continue).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=footer). Last update [84d57ae...3cd11c3](https://codecov.io/gh/tailwindlabs/tailwindcss/pull/2729?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).


Patch:
diff --git a/src/plugins/css/preflight.css b/src/plugins/css/preflight.css
index db3f9ad7..7afaf32b 100644
--- a/src/plugins/css/preflight.css
+++ b/src/plugins/css/preflight.css
@@ -62,11 +62,22 @@ ul {
  *    to override it to ensure consistency even when using the default theme.
  */
 
-html, body {
+html {
   font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 1 */
   line-height: 1.5; /* 2 */
 }
 
+
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+  font-family: inherit;
+  line-height: inherit;
+}
+
 /**
  * 1. Prevent padding and border from affecting element width.
  *


Test patch:
diff --git a/__tests__/fixtures/tailwind-output-flagged.css b/__tests__/fixtures/tailwind-output-flagged.css
index 00c2f515..d4194e8c 100644
--- a/__tests__/fixtures/tailwind-output-flagged.css
+++ b/__tests__/fixtures/tailwind-output-flagged.css
@@ -361,11 +361,21 @@ ul {
  *    to override it to ensure consistency even when using the default theme.
  */
 
-html, body {
+html {
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
   line-height: 1.5; /* 2 */
 }
 
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+  font-family: inherit;
+  line-height: inherit;
+}
+
 /**
  * 1. Prevent padding and border from affecting element width.
  *
diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css
index d5e8621b..5d83b71f 100644
--- a/__tests__/fixtures/tailwind-output-important.css
+++ b/__tests__/fixtures/tailwind-output-important.css
@@ -361,11 +361,21 @@ ul {
  *    to override it to ensure consistency even when using the default theme.
  */
 
-html, body {
+html {
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
   line-height: 1.5; /* 2 */
 }
 
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+  font-family: inherit;
+  line-height: inherit;
+}
+
 /**
  * 1. Prevent padding and border from affecting element width.
  *
diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css
index dc877981..9ff22242 100644
--- a/__tests__/fixtures/tailwind-output-no-color-opacity.css
+++ b/__tests__/fixtures/tailwind-output-no-color-opacity.css
@@ -361,11 +361,21 @@ ul {
  *    to override it to ensure consistency even when using the default theme.
  */
 
-html, body {
+html {
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
   line-height: 1.5; /* 2 */
 }
 
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+  font-family: inherit;
+  line-height: inherit;
+}
+
 /**
  * 1. Prevent padding and border from affecting element width.
  *
diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css
index 00c2f515..d4194e8c 100644
--- a/__tests__/fixtures/tailwind-output.css
+++ b/__tests__/fixtures/tailwind-output.css
@@ -361,11 +361,21 @@ ul {
  *    to override it to ensure consistency even when using the default theme.
  */
 
-html, body {
+html {
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
   line-height: 1.5; /* 2 */
 }
 
+/**
+ * Inherit font-family and line-height from `html` so users can set them as
+ * a class directly on the `html` element.
+ */
+
+body {
+  font-family: inherit;
+  line-height: inherit;
+}
+
 /**
  * 1. Prevent padding and border from affecting element width.
  *