diff --git a/components/style/values/generics/background.rs b/components/style/values/generics/background.rs
index 14ac9744b14..3780f9a4fc3 100644
--- a/components/style/values/generics/background.rs
+++ b/components/style/values/generics/background.rs
@@ -5,8 +5,13 @@
 //! Generic types for CSS values related to backgrounds.
 
 use crate::values::generics::length::{GenericLengthPercentageOrAuto, LengthPercentageOrAuto};
-use std::fmt::{self, Write};
-use style_traits::{CssWriter, ToCss};
+
+fn width_and_height_are_auto<L>(
+    width: &LengthPercentageOrAuto<L>,
+    height: &LengthPercentageOrAuto<L>,
+) -> bool {
+    width.is_auto() && height.is_auto()
+}
 
 /// A generic value for the `background-size` property.
 #[derive(
@@ -21,6 +26,7 @@ use style_traits::{CssWriter, ToCss};
     ToAnimatedValue,
     ToAnimatedZero,
     ToComputedValue,
+    ToCss,
 )]
 #[repr(C, u8)]
 pub enum GenericBackgroundSize<LengthPercent> {
@@ -29,6 +35,10 @@ pub enum GenericBackgroundSize<LengthPercent> {
         /// Explicit width.
         width: GenericLengthPercentageOrAuto<LengthPercent>,
         /// Explicit height.
+        /// NOTE(emilio): We should probably simplify all these in case `width`
+        /// and `height` are the same, but all other browsers agree on only
+        /// special-casing `auto`.
+        #[css(contextual_skip_if = "width_and_height_are_auto")]
         height: GenericLengthPercentageOrAuto<LengthPercent>,
     },
     /// `cover`
@@ -41,32 +51,6 @@ pub enum GenericBackgroundSize<LengthPercent> {
 
 pub use self::GenericBackgroundSize as BackgroundSize;
 
-impl<LengthPercentage> ToCss for BackgroundSize<LengthPercentage>
-where
-    LengthPercentage: ToCss,
-{
-    fn to_css<W>(&self, dest: &mut CssWriter<W>) -> fmt::Result
-    where
-        W: Write,
-    {
-        match self {
-            BackgroundSize::ExplicitSize { width, height } => {
-                width.to_css(dest)?;
-                // NOTE(emilio): We should probably simplify all these in case
-                // `width == `height`, but all other browsers agree on only
-                // special-casing `auto`.
-                if !width.is_auto() || !height.is_auto() {
-                    dest.write_str(" ")?;
-                    height.to_css(dest)?;
-                }
-                Ok(())
-            },
-            BackgroundSize::Cover => dest.write_str("cover"),
-            BackgroundSize::Contain => dest.write_str("contain"),
-        }
-    }
-}
-
 impl<LengthPercentage> BackgroundSize<LengthPercentage> {
     /// Returns `auto auto`.
     pub fn auto() -> Self {