diff --git a/components/style/properties/helpers/animated_properties.mako.rs b/components/style/properties/helpers/animated_properties.mako.rs
index 0b7cc3db957..85c588502c5 100644
--- a/components/style/properties/helpers/animated_properties.mako.rs
+++ b/components/style/properties/helpers/animated_properties.mako.rs
@@ -31,10 +31,9 @@ use values::animated::{Animate, Procedure, ToAnimatedValue, ToAnimatedZero};
 use values::animated::color::Color as AnimatedColor;
 use values::animated::effects::Filter as AnimatedFilter;
 #[cfg(feature = "gecko")] use values::computed::TransitionProperty;
-use values::computed::{Angle, CalcLengthOrPercentage};
+use values::computed::Angle;
 use values::computed::{ClipRect, Context};
-use values::computed::{Length, LengthOrPercentage, LengthOrPercentageOrAuto};
-use values::computed::LengthOrPercentageOrNone;
+use values::computed::{Length, LengthOrPercentage};
 use values::computed::{NonNegativeNumber, Number, NumberOrPercentage, Percentage};
 use values::computed::length::NonNegativeLengthOrPercentage;
 use values::computed::ToComputedValue;
@@ -845,53 +844,6 @@ impl ToAnimatedZero for Visibility {
     }
 }
 
-/// <https://drafts.csswg.org/css-transitions/#animtype-lpcalc>
-impl Animate for CalcLengthOrPercentage {
-    #[inline]
-    fn animate(&self, other: &Self, procedure: Procedure) -> Result<Self, ()> {
-        let animate_percentage_half = |this: Option<Percentage>, other: Option<Percentage>| {
-            if this.is_none() && other.is_none() {
-                return Ok(None);
-            }
-            let this = this.unwrap_or_default();
-            let other = other.unwrap_or_default();
-            Ok(Some(this.animate(&other, procedure)?))
-        };
-
-        let length = self.unclamped_length().animate(&other.unclamped_length(), procedure)?;
-        let percentage = animate_percentage_half(self.percentage, other.percentage)?;
-        Ok(CalcLengthOrPercentage::with_clamping_mode(length, percentage, self.clamping_mode))
-    }
-}
-
-impl ToAnimatedZero for LengthOrPercentageOrAuto {
-    #[inline]
-    fn to_animated_zero(&self) -> Result<Self, ()> {
-        match *self {
-            LengthOrPercentageOrAuto::Length(_) |
-            LengthOrPercentageOrAuto::Percentage(_) |
-            LengthOrPercentageOrAuto::Calc(_) => {
-                Ok(LengthOrPercentageOrAuto::Length(Length::new(0.)))
-            },
-            LengthOrPercentageOrAuto::Auto => Err(()),
-        }
-    }
-}
-
-impl ToAnimatedZero for LengthOrPercentageOrNone {
-    #[inline]
-    fn to_animated_zero(&self) -> Result<Self, ()> {
-        match *self {
-            LengthOrPercentageOrNone::Length(_) |
-            LengthOrPercentageOrNone::Percentage(_) |
-            LengthOrPercentageOrNone::Calc(_) => {
-                Ok(LengthOrPercentageOrNone::Length(Length::new(0.)))
-            },
-            LengthOrPercentageOrNone::None => Err(()),
-        }
-    }
-}
-
 impl ToAnimatedZero for FontWeight {
     #[inline]
     fn to_animated_zero(&self) -> Result<Self, ()> {
diff --git a/components/style/values/animated/length.rs b/components/style/values/animated/length.rs
new file mode 100644
index 00000000000..f6bbaa6df38
--- /dev/null
+++ b/components/style/values/animated/length.rs
@@ -0,0 +1,118 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+//! Animation implementation for various length-related types.
+
+use values::computed::MaxLength as ComputedMaxLength;
+use values::computed::MozLength as ComputedMozLength;
+use values::computed::Percentage;
+use values::computed::length::{Length, CalcLengthOrPercentage, LengthOrPercentageOrNone, LengthOrPercentageOrAuto};
+use super::{Animate, Procedure, ToAnimatedValue, ToAnimatedZero};
+
+/// <https://drafts.csswg.org/css-transitions/#animtype-lpcalc>
+impl Animate for CalcLengthOrPercentage {
+    #[inline]
+    fn animate(&self, other: &Self, procedure: Procedure) -> Result<Self, ()> {
+        let animate_percentage_half = |this: Option<Percentage>, other: Option<Percentage>| {
+            if this.is_none() && other.is_none() {
+                return Ok(None);
+            }
+            let this = this.unwrap_or_default();
+            let other = other.unwrap_or_default();
+            Ok(Some(this.animate(&other, procedure)?))
+        };
+
+        let length = self.unclamped_length().animate(&other.unclamped_length(), procedure)?;
+        let percentage = animate_percentage_half(self.percentage, other.percentage)?;
+        Ok(CalcLengthOrPercentage::with_clamping_mode(length, percentage, self.clamping_mode))
+    }
+}
+
+impl ToAnimatedZero for LengthOrPercentageOrAuto {
+    #[inline]
+    fn to_animated_zero(&self) -> Result<Self, ()> {
+        match *self {
+            LengthOrPercentageOrAuto::Length(_) |
+            LengthOrPercentageOrAuto::Percentage(_) |
+            LengthOrPercentageOrAuto::Calc(_) => {
+                Ok(LengthOrPercentageOrAuto::Length(Length::new(0.)))
+            },
+            LengthOrPercentageOrAuto::Auto => Err(()),
+        }
+    }
+}
+
+impl ToAnimatedZero for LengthOrPercentageOrNone {
+    #[inline]
+    fn to_animated_zero(&self) -> Result<Self, ()> {
+        match *self {
+            LengthOrPercentageOrNone::Length(_) |
+            LengthOrPercentageOrNone::Percentage(_) |
+            LengthOrPercentageOrNone::Calc(_) => {
+                Ok(LengthOrPercentageOrNone::Length(Length::new(0.)))
+            },
+            LengthOrPercentageOrNone::None => Err(()),
+        }
+    }
+}
+
+impl ToAnimatedValue for ComputedMaxLength {
+    type AnimatedValue = Self;
+
+    #[inline]
+    fn to_animated_value(self) -> Self {
+        self
+    }
+
+    #[inline]
+    fn from_animated_value(animated: Self::AnimatedValue) -> Self {
+        use values::computed::{Length, LengthOrPercentageOrNone, Percentage};
+        use values::generics::length::MaxLength as GenericMaxLength;
+        match animated {
+            GenericMaxLength::LengthOrPercentageOrNone(lopn) => {
+                let result = match lopn {
+                    LengthOrPercentageOrNone::Length(px) => {
+                        LengthOrPercentageOrNone::Length(Length::new(px.px().max(0.)))
+                    },
+                    LengthOrPercentageOrNone::Percentage(percentage) => {
+                        LengthOrPercentageOrNone::Percentage(Percentage(percentage.0.max(0.)))
+                    },
+                    _ => lopn,
+                };
+                GenericMaxLength::LengthOrPercentageOrNone(result)
+            },
+            _ => animated,
+        }
+    }
+}
+
+impl ToAnimatedValue for ComputedMozLength {
+    type AnimatedValue = Self;
+
+    #[inline]
+    fn to_animated_value(self) -> Self {
+        self
+    }
+
+    #[inline]
+    fn from_animated_value(animated: Self::AnimatedValue) -> Self {
+        use values::computed::{Length, LengthOrPercentageOrAuto, Percentage};
+        use values::generics::length::MozLength as GenericMozLength;
+        match animated {
+            GenericMozLength::LengthOrPercentageOrAuto(lopa) => {
+                let result = match lopa {
+                    LengthOrPercentageOrAuto::Length(px) => {
+                        LengthOrPercentageOrAuto::Length(Length::new(px.px().max(0.)))
+                    },
+                    LengthOrPercentageOrAuto::Percentage(percentage) => {
+                        LengthOrPercentageOrAuto::Percentage(Percentage(percentage.0.max(0.)))
+                    },
+                    _ => lopa,
+                };
+                GenericMozLength::LengthOrPercentageOrAuto(result)
+            },
+            _ => animated,
+        }
+    }
+}
diff --git a/components/style/values/animated/mod.rs b/components/style/values/animated/mod.rs
index 41482418b1d..7d781f19a5d 100644
--- a/components/style/values/animated/mod.rs
+++ b/components/style/values/animated/mod.rs
@@ -15,13 +15,12 @@ use smallvec::SmallVec;
 use std::cmp;
 use values::computed::Angle as ComputedAngle;
 use values::computed::BorderCornerRadius as ComputedBorderCornerRadius;
-use values::computed::MaxLength as ComputedMaxLength;
-use values::computed::MozLength as ComputedMozLength;
 use values::computed::length::CalcLengthOrPercentage;
 use values::computed::url::ComputedUrl;
 
 pub mod color;
 pub mod effects;
+mod length;
 
 /// The category a property falls into for ordering purposes.
 ///
@@ -345,66 +344,6 @@ impl ToAnimatedValue for ComputedBorderCornerRadius {
     }
 }
 
-impl ToAnimatedValue for ComputedMaxLength {
-    type AnimatedValue = Self;
-
-    #[inline]
-    fn to_animated_value(self) -> Self {
-        self
-    }
-
-    #[inline]
-    fn from_animated_value(animated: Self::AnimatedValue) -> Self {
-        use values::computed::{Length, LengthOrPercentageOrNone, Percentage};
-        use values::generics::length::MaxLength as GenericMaxLength;
-        match animated {
-            GenericMaxLength::LengthOrPercentageOrNone(lopn) => {
-                let result = match lopn {
-                    LengthOrPercentageOrNone::Length(px) => {
-                        LengthOrPercentageOrNone::Length(Length::new(px.px().max(0.)))
-                    },
-                    LengthOrPercentageOrNone::Percentage(percentage) => {
-                        LengthOrPercentageOrNone::Percentage(Percentage(percentage.0.max(0.)))
-                    },
-                    _ => lopn,
-                };
-                GenericMaxLength::LengthOrPercentageOrNone(result)
-            },
-            _ => animated,
-        }
-    }
-}
-
-impl ToAnimatedValue for ComputedMozLength {
-    type AnimatedValue = Self;
-
-    #[inline]
-    fn to_animated_value(self) -> Self {
-        self
-    }
-
-    #[inline]
-    fn from_animated_value(animated: Self::AnimatedValue) -> Self {
-        use values::computed::{Length, LengthOrPercentageOrAuto, Percentage};
-        use values::generics::length::MozLength as GenericMozLength;
-        match animated {
-            GenericMozLength::LengthOrPercentageOrAuto(lopa) => {
-                let result = match lopa {
-                    LengthOrPercentageOrAuto::Length(px) => {
-                        LengthOrPercentageOrAuto::Length(Length::new(px.px().max(0.)))
-                    },
-                    LengthOrPercentageOrAuto::Percentage(percentage) => {
-                        LengthOrPercentageOrAuto::Percentage(Percentage(percentage.0.max(0.)))
-                    },
-                    _ => lopa,
-                };
-                GenericMozLength::LengthOrPercentageOrAuto(result)
-            },
-            _ => animated,
-        }
-    }
-}
-
 impl ToAnimatedZero for Au {
     #[inline]
     fn to_animated_zero(&self) -> Result<Self, ()> {