diff --git a/components/style/properties/shorthands/background.mako.rs b/components/style/properties/shorthands/background.mako.rs
index 92f926ec3c1..ff5edecff4d 100644
--- a/components/style/properties/shorthands/background.mako.rs
+++ b/components/style/properties/shorthands/background.mako.rs
@@ -12,7 +12,7 @@
                                     background-clip"
                     spec="https://drafts.csswg.org/css-backgrounds/#the-background">
     use crate::properties::longhands::{background_position_x, background_position_y, background_repeat};
-    use crate::properties::longhands::{background_attachment, background_image, background_size, background_origin};
+    use crate::properties::longhands::{background_attachment, background_color, background_image, background_size, background_origin};
     use crate::properties::longhands::background_clip;
     use crate::properties::longhands::background_clip::single_value::computed_value::T as Clip;
     use crate::properties::longhands::background_origin::single_value::computed_value::T as Origin;
@@ -156,35 +156,71 @@
                     dest.write_str(", ")?;
                 }
 
+                let mut wrote_value = false;
+
                 if i == len - 1 {
-                    self.background_color.to_css(dest)?;
-                    dest.write_str(" ")?;
+                    if *self.background_color != background_color::get_initial_specified_value() {
+                        self.background_color.to_css(dest)?;
+                        wrote_value = true;
+                    }
+                }
+
+                if *image != background_image::single_value::get_initial_specified_value() {
+                    if wrote_value {
+                        dest.write_str(" ")?;
+                    }
+                    image.to_css(dest)?;
+                    wrote_value = true;
+                }
+
+                // Size is only valid after a position so when there is a
+                // non-initial size we must also serialize position
+                if *position_x != PositionComponent::zero() ||
+                    *position_y != PositionComponent::zero() ||
+                    *size != background_size::single_value::get_initial_specified_value()
+                {
+                    if wrote_value {
+                        dest.write_str(" ")?;
+                    }
+
+                    Position {
+                        horizontal: position_x.clone(),
+                        vertical: position_y.clone()
+                    }.to_css(dest)?;
+
+                    wrote_value = true;
+
+                    if *size != background_size::single_value::get_initial_specified_value() {
+                        dest.write_str(" / ")?;
+                        size.to_css(dest)?;
+                    }
                 }
 
-                image.to_css(dest)?;
                 % for name in "repeat attachment".split():
-                    dest.write_str(" ")?;
-                    ${name}.to_css(dest)?;
+                    if *${name} != background_${name}::single_value::get_initial_specified_value() {
+                        if wrote_value {
+                            dest.write_str(" ")?;
+                        }
+                        ${name}.to_css(dest)?;
+                        wrote_value = true;
+                    }
                 % endfor
 
-                dest.write_str(" ")?;
-                Position {
-                    horizontal: position_x.clone(),
-                    vertical: position_y.clone()
-                }.to_css(dest)?;
-
-                if *size != background_size::single_value::get_initial_specified_value() {
-                    dest.write_str(" / ")?;
-                    size.to_css(dest)?;
-                }
-
                 if *origin != Origin::PaddingBox || *clip != Clip::BorderBox {
-                    dest.write_str(" ")?;
+                    if wrote_value {
+                        dest.write_str(" ")?;
+                    }
                     origin.to_css(dest)?;
                     if *clip != From::from(*origin) {
                         dest.write_str(" ")?;
                         clip.to_css(dest)?;
                     }
+
+                    wrote_value = true;
+                }
+
+                if !wrote_value {
+                    image.to_css(dest)?;
                 }
             }