diff --git a/components/style/properties/longhand/font.mako.rs b/components/style/properties/longhand/font.mako.rs
index 013b6be5f79..d143398b2d8 100644
--- a/components/style/properties/longhand/font.mako.rs
+++ b/components/style/properties/longhand/font.mako.rs
@@ -122,16 +122,36 @@
         // FIXME(bholley): The fast thing to do here would be to look up the
         // string (as lowercase) in the static atoms table. We don't have an
         // API to do that yet though, so we do the simple thing for now.
+        let mut css_wide_keyword = false;
         match_ignore_ascii_case! { first_ident,
             "serif" => return Ok(FontFamily::Generic(atom!("serif"))),
             "sans-serif" => return Ok(FontFamily::Generic(atom!("sans-serif"))),
             "cursive" => return Ok(FontFamily::Generic(atom!("cursive"))),
             "fantasy" => return Ok(FontFamily::Generic(atom!("fantasy"))),
             "monospace" => return Ok(FontFamily::Generic(atom!("monospace"))),
+
+            // https://drafts.csswg.org/css-fonts/#propdef-font-family
+            // "Font family names that happen to be the same as a keyword value
+            //  (‘inherit’, ‘serif’, ‘sans-serif’, ‘monospace’, ‘fantasy’, and ‘cursive’)
+            //  must be quoted to prevent confusion with the keywords with the same names.
+            //  The keywords ‘initial’ and ‘default’ are reserved for future use
+            //  and must also be quoted when used as font names.
+            //  UAs must not consider these keywords as matching the <family-name> type."
+            "inherit" => css_wide_keyword = true,
+            "initial" => css_wide_keyword = true,
+            "unset" => css_wide_keyword = true,
+            "default" => css_wide_keyword = true,
             _ => {}
         }
 
         let mut value = first_ident.into_owned();
+        // These keywords are not allowed by themselves.
+        // The only way this value can be valid with with another keyword.
+        if css_wide_keyword {
+            let ident = input.expect_ident()?;
+            value.push_str(" ");
+            value.push_str(&ident);
+        }
         while let Ok(ident) = input.try(|input| input.expect_ident()) {
             value.push_str(" ");
             value.push_str(&ident);
diff --git a/tests/wpt/mozilla/meta/css/test_font_family_parsing.html.ini b/tests/wpt/mozilla/meta/css/test_font_family_parsing.html.ini
index 1770c4e3433..02c92c1fe38 100644
--- a/tests/wpt/mozilla/meta/css/test_font_family_parsing.html.ini
+++ b/tests/wpt/mozilla/meta/css/test_font_family_parsing.html.ini
@@ -1,737 +1,11 @@
 [test_font_family_parsing.html]
   type: testharness
-  [font: 16px default]
-    expected: FAIL
-
-  [font: 16px default (setter)]
-    expected: FAIL
-
-  [font: 900px default]
-    expected: FAIL
-
-  [font: 900px default (setter)]
-    expected: FAIL
-
-  [font: 900em default]
-    expected: FAIL
-
-  [font: 900em default (setter)]
-    expected: FAIL
-
-  [font: 35% default]
-    expected: FAIL
-
-  [font: 35% default (setter)]
-    expected: FAIL
-
-  [font: 7832.3% default]
-    expected: FAIL
-
-  [font: 7832.3% default (setter)]
-    expected: FAIL
-
-  [font: xx-large default]
-    expected: FAIL
-
-  [font: xx-large default (setter)]
-    expected: FAIL
-
-  [font: lighter larger default]
-    expected: FAIL
-
-  [font: lighter larger default (setter)]
-    expected: FAIL
-
-  [font: italic 16px default]
-    expected: FAIL
-
-  [font: italic 16px default (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px default]
-    expected: FAIL
-
-  [font: italic bold 16px default (setter)]
-    expected: FAIL
-
-  [font: normal smaller default]
-    expected: FAIL
-
-  [font: normal smaller default (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px default]
-    expected: FAIL
-
-  [font: normal normal 16px default (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px default]
-    expected: FAIL
-
-  [font: 400 normal 16px default (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px default]
-    expected: FAIL
-
-  [font: bolder oblique 16px default (setter)]
-    expected: FAIL
-
-  [font: 16px initial]
-    expected: FAIL
-
-  [font: 16px initial (setter)]
-    expected: FAIL
-
-  [font: 900px initial]
-    expected: FAIL
-
-  [font: 900px initial (setter)]
-    expected: FAIL
-
-  [font: 900em initial]
-    expected: FAIL
-
-  [font: 900em initial (setter)]
-    expected: FAIL
-
-  [font: 35% initial]
-    expected: FAIL
-
-  [font: 35% initial (setter)]
-    expected: FAIL
-
-  [font: 7832.3% initial]
-    expected: FAIL
-
-  [font: 7832.3% initial (setter)]
-    expected: FAIL
-
-  [font: xx-large initial]
-    expected: FAIL
-
-  [font: xx-large initial (setter)]
-    expected: FAIL
-
-  [font: lighter larger initial]
-    expected: FAIL
-
-  [font: lighter larger initial (setter)]
-    expected: FAIL
-
-  [font: italic 16px initial]
-    expected: FAIL
-
-  [font: italic 16px initial (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px initial]
-    expected: FAIL
-
-  [font: italic bold 16px initial (setter)]
-    expected: FAIL
-
-  [font: normal smaller initial]
-    expected: FAIL
-
-  [font: normal smaller initial (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px initial]
-    expected: FAIL
-
-  [font: normal normal 16px initial (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px initial]
-    expected: FAIL
-
-  [font: 400 normal 16px initial (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px initial]
-    expected: FAIL
-
-  [font: bolder oblique 16px initial (setter)]
-    expected: FAIL
-
-  [font: 16px inherit]
-    expected: FAIL
-
-  [font: 16px inherit (setter)]
-    expected: FAIL
-
-  [font: 900px inherit]
-    expected: FAIL
-
-  [font: 900px inherit (setter)]
-    expected: FAIL
-
-  [font: 900em inherit]
-    expected: FAIL
-
-  [font: 900em inherit (setter)]
-    expected: FAIL
-
-  [font: 35% inherit]
-    expected: FAIL
-
-  [font: 35% inherit (setter)]
-    expected: FAIL
-
-  [font: 7832.3% inherit]
-    expected: FAIL
-
-  [font: 7832.3% inherit (setter)]
-    expected: FAIL
-
-  [font: xx-large inherit]
-    expected: FAIL
-
-  [font: xx-large inherit (setter)]
-    expected: FAIL
-
-  [font: lighter larger inherit]
-    expected: FAIL
-
-  [font: lighter larger inherit (setter)]
-    expected: FAIL
-
-  [font: italic 16px inherit]
-    expected: FAIL
-
-  [font: italic 16px inherit (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px inherit]
-    expected: FAIL
-
-  [font: italic bold 16px inherit (setter)]
-    expected: FAIL
-
-  [font: normal smaller inherit]
-    expected: FAIL
-
-  [font: normal smaller inherit (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px inherit]
-    expected: FAIL
-
-  [font: normal normal 16px inherit (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px inherit]
-    expected: FAIL
-
-  [font: 400 normal 16px inherit (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px inherit]
-    expected: FAIL
-
-  [font: bolder oblique 16px inherit (setter)]
-    expected: FAIL
-
-  [font-family: default, simple]
-    expected: FAIL
-
-  [font-family: default, simple (setter)]
-    expected: FAIL
-
-  [font: 16px default, simple]
-    expected: FAIL
-
-  [font: 16px default, simple (setter)]
-    expected: FAIL
-
-  [font: 900px default, simple]
-    expected: FAIL
-
-  [font: 900px default, simple (setter)]
-    expected: FAIL
-
-  [font: 900em default, simple]
-    expected: FAIL
-
-  [font: 900em default, simple (setter)]
-    expected: FAIL
-
-  [font: 35% default, simple]
-    expected: FAIL
-
-  [font: 35% default, simple (setter)]
-    expected: FAIL
-
-  [font: 7832.3% default, simple]
-    expected: FAIL
-
-  [font: 7832.3% default, simple (setter)]
-    expected: FAIL
-
-  [font: xx-large default, simple]
-    expected: FAIL
-
-  [font: xx-large default, simple (setter)]
-    expected: FAIL
-
-  [font: lighter larger default, simple]
-    expected: FAIL
-
-  [font: lighter larger default, simple (setter)]
-    expected: FAIL
-
-  [font: italic 16px default, simple]
-    expected: FAIL
-
-  [font: italic 16px default, simple (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px default, simple]
-    expected: FAIL
-
-  [font: italic bold 16px default, simple (setter)]
-    expected: FAIL
-
-  [font: normal smaller default, simple]
-    expected: FAIL
-
-  [font: normal smaller default, simple (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px default, simple]
-    expected: FAIL
-
-  [font: normal normal 16px default, simple (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px default, simple]
-    expected: FAIL
-
-  [font: 400 normal 16px default, simple (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px default, simple]
-    expected: FAIL
-
-  [font: bolder oblique 16px default, simple (setter)]
-    expected: FAIL
-
   [font-family: initial, simple (setter)]
     expected: FAIL
 
-  [font: 16px initial, simple]
-    expected: FAIL
-
-  [font: 16px initial, simple (setter)]
-    expected: FAIL
-
-  [font: 900px initial, simple]
-    expected: FAIL
-
-  [font: 900px initial, simple (setter)]
-    expected: FAIL
-
-  [font: 900em initial, simple]
-    expected: FAIL
-
-  [font: 900em initial, simple (setter)]
-    expected: FAIL
-
-  [font: 35% initial, simple]
-    expected: FAIL
-
-  [font: 35% initial, simple (setter)]
-    expected: FAIL
-
-  [font: 7832.3% initial, simple]
-    expected: FAIL
-
-  [font: 7832.3% initial, simple (setter)]
-    expected: FAIL
-
-  [font: xx-large initial, simple]
-    expected: FAIL
-
-  [font: xx-large initial, simple (setter)]
-    expected: FAIL
-
-  [font: lighter larger initial, simple]
-    expected: FAIL
-
-  [font: lighter larger initial, simple (setter)]
-    expected: FAIL
-
-  [font: italic 16px initial, simple]
-    expected: FAIL
-
-  [font: italic 16px initial, simple (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px initial, simple]
-    expected: FAIL
-
-  [font: italic bold 16px initial, simple (setter)]
-    expected: FAIL
-
-  [font: normal smaller initial, simple]
-    expected: FAIL
-
-  [font: normal smaller initial, simple (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px initial, simple]
-    expected: FAIL
-
-  [font: normal normal 16px initial, simple (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px initial, simple]
-    expected: FAIL
-
-  [font: 400 normal 16px initial, simple (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px initial, simple]
-    expected: FAIL
-
-  [font: bolder oblique 16px initial, simple (setter)]
-    expected: FAIL
-
   [font-family: inherit, simple (setter)]
     expected: FAIL
 
-  [font: 16px inherit, simple]
-    expected: FAIL
-
-  [font: 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: 900px inherit, simple]
-    expected: FAIL
-
-  [font: 900px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: 900em inherit, simple]
-    expected: FAIL
-
-  [font: 900em inherit, simple (setter)]
-    expected: FAIL
-
-  [font: 35% inherit, simple]
-    expected: FAIL
-
-  [font: 35% inherit, simple (setter)]
-    expected: FAIL
-
-  [font: 7832.3% inherit, simple]
-    expected: FAIL
-
-  [font: 7832.3% inherit, simple (setter)]
-    expected: FAIL
-
-  [font: xx-large inherit, simple]
-    expected: FAIL
-
-  [font: xx-large inherit, simple (setter)]
-    expected: FAIL
-
-  [font: lighter larger inherit, simple]
-    expected: FAIL
-
-  [font: lighter larger inherit, simple (setter)]
-    expected: FAIL
-
-  [font: italic 16px inherit, simple]
-    expected: FAIL
-
-  [font: italic 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px inherit, simple]
-    expected: FAIL
-
-  [font: italic bold 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: normal smaller inherit, simple]
-    expected: FAIL
-
-  [font: normal smaller inherit, simple (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px inherit, simple]
-    expected: FAIL
-
-  [font: normal normal 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px inherit, simple]
-    expected: FAIL
-
-  [font: 400 normal 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px inherit, simple]
-    expected: FAIL
-
-  [font: bolder oblique 16px inherit, simple (setter)]
-    expected: FAIL
-
-  [font-family: simple, default]
-    expected: FAIL
-
-  [font-family: simple, default (setter)]
-    expected: FAIL
-
-  [font: 16px simple, default]
-    expected: FAIL
-
-  [font: 16px simple, default (setter)]
-    expected: FAIL
-
-  [font: 900px simple, default]
-    expected: FAIL
-
-  [font: 900px simple, default (setter)]
-    expected: FAIL
-
-  [font: 900em simple, default]
-    expected: FAIL
-
-  [font: 900em simple, default (setter)]
-    expected: FAIL
-
-  [font: 35% simple, default]
-    expected: FAIL
-
-  [font: 35% simple, default (setter)]
-    expected: FAIL
-
-  [font: 7832.3% simple, default]
-    expected: FAIL
-
-  [font: 7832.3% simple, default (setter)]
-    expected: FAIL
-
-  [font: xx-large simple, default]
-    expected: FAIL
-
-  [font: xx-large simple, default (setter)]
-    expected: FAIL
-
-  [font: lighter larger simple, default]
-    expected: FAIL
-
-  [font: lighter larger simple, default (setter)]
-    expected: FAIL
-
-  [font: italic 16px simple, default]
-    expected: FAIL
-
-  [font: italic 16px simple, default (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px simple, default]
-    expected: FAIL
-
-  [font: italic bold 16px simple, default (setter)]
-    expected: FAIL
-
-  [font: normal smaller simple, default]
-    expected: FAIL
-
-  [font: normal smaller simple, default (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px simple, default]
-    expected: FAIL
-
-  [font: normal normal 16px simple, default (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, default]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, default (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, default]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, default (setter)]
-    expected: FAIL
-
-  [font-family: simple, initial]
-    expected: FAIL
-
-  [font-family: simple, initial (setter)]
-    expected: FAIL
-
-  [font: 16px simple, initial]
-    expected: FAIL
-
-  [font: 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font: 900px simple, initial]
-    expected: FAIL
-
-  [font: 900px simple, initial (setter)]
-    expected: FAIL
-
-  [font: 900em simple, initial]
-    expected: FAIL
-
-  [font: 900em simple, initial (setter)]
-    expected: FAIL
-
-  [font: 35% simple, initial]
-    expected: FAIL
-
-  [font: 35% simple, initial (setter)]
-    expected: FAIL
-
-  [font: 7832.3% simple, initial]
-    expected: FAIL
-
-  [font: 7832.3% simple, initial (setter)]
-    expected: FAIL
-
-  [font: xx-large simple, initial]
-    expected: FAIL
-
-  [font: xx-large simple, initial (setter)]
-    expected: FAIL
-
-  [font: lighter larger simple, initial]
-    expected: FAIL
-
-  [font: lighter larger simple, initial (setter)]
-    expected: FAIL
-
-  [font: italic 16px simple, initial]
-    expected: FAIL
-
-  [font: italic 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px simple, initial]
-    expected: FAIL
-
-  [font: italic bold 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font: normal smaller simple, initial]
-    expected: FAIL
-
-  [font: normal smaller simple, initial (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px simple, initial]
-    expected: FAIL
-
-  [font: normal normal 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, initial]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, initial]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, initial (setter)]
-    expected: FAIL
-
-  [font-family: simple, inherit]
-    expected: FAIL
-
-  [font-family: simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 16px simple, inherit]
-    expected: FAIL
-
-  [font: 16px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 900px simple, inherit]
-    expected: FAIL
-
-  [font: 900px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 900em simple, inherit]
-    expected: FAIL
-
-  [font: 900em simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 35% simple, inherit]
-    expected: FAIL
-
-  [font: 35% simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 7832.3% simple, inherit]
-    expected: FAIL
-
-  [font: 7832.3% simple, inherit (setter)]
-    expected: FAIL
-
-  [font: xx-large simple, inherit]
-    expected: FAIL
-
-  [font: xx-large simple, inherit (setter)]
-    expected: FAIL
-
-  [font: lighter larger simple, inherit]
-    expected: FAIL
-
-  [font: lighter larger simple, inherit (setter)]
-    expected: FAIL
-
-  [font: italic 16px simple, inherit]
-    expected: FAIL
-
-  [font: italic 16px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: italic bold 16px simple, inherit]
-    expected: FAIL
-
-  [font: italic bold 16px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: normal smaller simple, inherit]
-    expected: FAIL
-
-  [font: normal smaller simple, inherit (setter)]
-    expected: FAIL
-
-  [font: normal normal 16px simple, inherit]
-    expected: FAIL
-
-  [font: normal normal 16px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, inherit]
-    expected: FAIL
-
-  [font: 400 normal 16px simple, inherit (setter)]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, inherit]
-    expected: FAIL
-
-  [font: bolder oblique 16px simple, inherit (setter)]
-    expected: FAIL
-
   [font-family: initial simple]
     expected: FAIL