--- a/servo/components/style/properties/gecko.mako.rs
+++ b/servo/components/style/properties/gecko.mako.rs
@@ -2980,16 +2980,19 @@ fn static_assert() {
         };
 
         unsafe {
             match *servo_value {
                 ${transform_function_arm("Matrix", "matrix3d", ["number"] * 16)}
                 ${transform_function_arm("MatrixWithPercents", "matrix3d", ["number"] * 12 + ["lop"] * 2
                                          + ["length"] + ["number"])}
                 ${transform_function_arm("Skew", "skew", ["angle"] * 2)}
+                ${transform_function_arm("TranslateX", "translatex", ["lop"])}
+                ${transform_function_arm("TranslateY", "translatey", ["lop"])}
+                ${transform_function_arm("TranslateZ", "translatez", ["length"])}
                 ${transform_function_arm("Translate", "translate3d", ["lop", "lop", "length"])}
                 ${transform_function_arm("Scale", "scale3d", ["number"] * 3)}
                 ${transform_function_arm("Rotate", "rotate3d", ["number"] * 3 + ["angle"])}
                 ${transform_function_arm("Perspective", "perspective", ["length"])}
                 ${transform_function_arm("InterpolateMatrix", "interpolatematrix",
                                          ["list"] * 2 + ["percentage"])}
                 ${transform_function_arm("AccumulateMatrix", "accumulatematrix",
                                          ["list"] * 2 + ["integer_to_percentage"])}
@@ -3100,16 +3103,20 @@ fn static_assert() {
         let transform_function = unsafe {
             bindings::Gecko_CSSValue_GetKeyword(bindings::Gecko_CSSValue_GetArrayItemConst(gecko_value, 0))
         };
 
         unsafe {
             match transform_function {
                 ${computed_operation_arm("Matrix", "matrix3d", ["number"] * 16)}
                 ${computed_operation_arm("Skew", "skew", ["angle"] * 2)}
+
+                ${computed_operation_arm("TranslateX", "translatex", ["lop"])}
+                ${computed_operation_arm("TranslateY", "translatey", ["lop"])}
+                ${computed_operation_arm("TranslateZ", "translatez", ["length"])}
                 ${computed_operation_arm("Translate", "translate3d", ["lop", "lop", "length"])}
                 ${computed_operation_arm("Scale", "scale3d", ["number"] * 3)}
                 ${computed_operation_arm("Rotate", "rotate3d", ["number"] * 3 + ["angle"])}
                 ${computed_operation_arm("Perspective", "perspective", ["length"])}
                 ${computed_operation_arm("InterpolateMatrix", "interpolatematrix",
                                          ["list"] * 2 + ["percentage"])}
                 ${computed_operation_arm("AccumulateMatrix", "accumulatematrix",
                                          ["list"] * 2 + ["percentage_to_integer"])}

--- a/servo/components/style/properties/helpers/animated_properties.mako.rs
+++ b/servo/components/style/properties/helpers/animated_properties.mako.rs
@@ -1168,16 +1168,31 @@ impl ToAnimatedZero for TransformOperati
                 Ok(TransformOperation::Matrix(ComputedMatrix::identity()))
             },
             TransformOperation::Skew(sx, sy) => {
                 Ok(TransformOperation::Skew(
                     sx.to_animated_zero()?,
                     sy.to_animated_zero()?,
                 ))
             },
+            TransformOperation::TranslateX(ref tx) => {
+                Ok(TransformOperation::TranslateX(
+                    tx.to_animated_zero()?
+                ))
+            },
+            TransformOperation::TranslateY(ref ty) => {
+                Ok(TransformOperation::TranslateY(
+                    ty.to_animated_zero()?
+                ))
+            },
+            TransformOperation::TranslateZ(ref tz) => {
+                Ok(TransformOperation::TranslateZ(
+                    tz.to_animated_zero()?
+                ))
+            },
             TransformOperation::Translate(ref tx, ref ty, ref tz) => {
                 Ok(TransformOperation::Translate(
                     tx.to_animated_zero()?,
                     ty.to_animated_zero()?,
                     tz.to_animated_zero()?,
                 ))
             },
             TransformOperation::Scale(..) => {

--- a/servo/components/style/properties/longhand/box.mako.rs
+++ b/servo/components/style/properties/longhand/box.mako.rs
@@ -709,16 +709,19 @@
         #[derive(Clone, Debug, PartialEq)]
         #[cfg_attr(feature = "gecko", derive(MallocSizeOf))]
         #[cfg_attr(feature = "servo", derive(HeapSizeOf))]
         pub enum ComputedOperation {
             Matrix(ComputedMatrix),
             // For `-moz-transform` matrix and matrix3d.
             MatrixWithPercents(ComputedMatrixWithPercents),
             Skew(computed::Angle, computed::Angle),
+            TranslateX(LengthOrPercentage),
+            TranslateY(LengthOrPercentage),
+            TranslateZ(Length),
             Translate(computed::LengthOrPercentage,
                       computed::LengthOrPercentage,
                       computed::Length),
             Scale(CSSFloat, CSSFloat, CSSFloat),
             Rotate(CSSFloat, CSSFloat, CSSFloat, computed::Angle),
             Perspective(computed::Length),
             // For mismatched transform lists.
             // A vector of |ComputedOperation| could contain an |InterpolateMatrix| and other
@@ -1291,34 +1294,25 @@
                         let ty = ty.to_computed_value(context);
                         result.push(computed_value::ComputedOperation::Translate(
                             tx,
                             ty,
                             computed::length::Length::new(0.)));
                     }
                     SpecifiedOperation::TranslateX(ref tx) => {
                         let tx = tx.to_computed_value(context);
-                        result.push(computed_value::ComputedOperation::Translate(
-                            tx,
-                            computed::length::LengthOrPercentage::zero(),
-                            computed::length::Length::new(0.)));
+                        result.push(computed_value::ComputedOperation::TranslateX(tx));
                     }
                     SpecifiedOperation::TranslateY(ref ty) => {
                         let ty = ty.to_computed_value(context);
-                        result.push(computed_value::ComputedOperation::Translate(
-                            computed::length::LengthOrPercentage::zero(),
-                            ty,
-                            computed::length::Length::new(0.)));
+                        result.push(computed_value::ComputedOperation::TranslateY(ty));
                     }
                     SpecifiedOperation::TranslateZ(ref tz) => {
                         let tz = tz.to_computed_value(context);
-                        result.push(computed_value::ComputedOperation::Translate(
-                            computed::length::LengthOrPercentage::zero(),
-                            computed::length::LengthOrPercentage::zero(),
-                            tz));
+                        result.push(computed_value::ComputedOperation::TranslateZ(tz));
                     }
                     SpecifiedOperation::Translate3D(ref tx, ref ty, ref tz) => {
                         let tx = tx.to_computed_value(context);
                         let ty = ty.to_computed_value(context);
                         let tz = tz.to_computed_value(context);
                         result.push(computed_value::ComputedOperation::Translate(tx, ty, tz));
                     }
                     SpecifiedOperation::Scale(factor, None) => {
@@ -1452,19 +1446,29 @@
                                 m33: Number::from_computed_value(&computed.m33),
                                 m34: Number::from_computed_value(&computed.m34),
                                 m41: Either::Second(LengthOrPercentage::from_computed_value(&computed.m41)),
                                 m42: Either::Second(LengthOrPercentage::from_computed_value(&computed.m42)),
                                 m43: LengthOrNumber::from_computed_value(&Either::First(computed.m43)),
                                 m44: Number::from_computed_value(&computed.m44),
                             });
                         }
+                        computed_value::ComputedOperation::TranslateX(ref tx) => {
+                            result.push(SpecifiedOperation::TranslateX(
+                                              ToComputedValue::from_computed_value(tx)));
+                        }
+                        computed_value::ComputedOperation::TranslateY(ref ty) => {
+                            result.push(SpecifiedOperation::TranslateY(
+                                              ToComputedValue::from_computed_value(ty)));
+                        }
+                        computed_value::ComputedOperation::TranslateZ(ref tz) => {
+                            result.push(SpecifiedOperation::TranslateZ(
+                                              ToComputedValue::from_computed_value(tz)));
+                        }
                         computed_value::ComputedOperation::Translate(ref tx, ref ty, ref tz) => {
-                            // XXXManishearth we lose information here; perhaps we should try to
-                            // recover the original function? Not sure if this can be observed.
                             result.push(SpecifiedOperation::Translate3D(
                                               ToComputedValue::from_computed_value(tx),
                                               ToComputedValue::from_computed_value(ty),
                                               ToComputedValue::from_computed_value(tz)));
                         }
                         computed_value::ComputedOperation::Scale(ref sx, ref sy, ref sz) => {
                             result.push(SpecifiedOperation::Scale3D(
                                     Number::from_computed_value(sx),

--- a/servo/components/style/values/computed/transform.rs
+++ b/servo/components/style/values/computed/transform.rs
@@ -87,16 +87,33 @@ impl TransformList {
                     Transform3D::create_rotation(ax, ay, az, theta.into())
                 }
                 ComputedOperation::Perspective(d) => {
                     Self::create_perspective_matrix(d.px())
                 }
                 ComputedOperation::Scale(sx, sy, sz) => {
                     Transform3D::create_scale(sx, sy, sz)
                 }
+                ComputedOperation::TranslateX(tx) => {
+                    let tx =  match reference_box {
+                        Some(relative_border_box) => tx.to_used_value(relative_border_box.size.width).to_f32_px(),
+                        None => extract_pixel_length(&tx),
+                    };
+                    Transform3D::create_translation(tx, 0., 0.)
+                }
+                ComputedOperation::TranslateY(ty) => {
+                    let ty =  match reference_box {
+                        Some(relative_border_box) => ty.to_used_value(relative_border_box.size.height).to_f32_px(),
+                        None => extract_pixel_length(&ty),
+                    };
+                    Transform3D::create_translation(0., ty, 0.)
+                }
+                ComputedOperation::TranslateZ(tz) => {
+                    Transform3D::create_translation(0., 0., tz.to_f32_px())
+                }
                 ComputedOperation::Translate(tx, ty, tz) => {
                     let (tx, ty) = match reference_box {
                         Some(relative_border_box) => {
                             (tx.to_pixel_length(relative_border_box.size.width).px(),
                              ty.to_pixel_length(relative_border_box.size.height).px())
                         },
                         None => {
                             // If we don't have reference box, we cannot resolve the used value,