--- a/servo/components/style/properties/gecko.mako.rs
+++ b/servo/components/style/properties/gecko.mako.rs
@@ -2602,28 +2602,34 @@ fn static_assert() {
     pub fn clone_font_weight(&self) -> longhands::font_weight::computed_value::T {
         let weight: f32 = unsafe {
             bindings::Gecko_FontWeight_ToFloat(self.gecko.mFont.weight)
         };
         longhands::font_weight::computed_value::T(weight)
     }
 
     pub fn set_font_stretch(&mut self, v: longhands::font_stretch::computed_value::T) {
-        unsafe { bindings::Gecko_FontStretch_SetFloat(&mut self.gecko.mFont.stretch, (v.0).0) };
+        unsafe {
+            bindings::Gecko_FontStretch_SetFloat(
+                &mut self.gecko.mFont.stretch,
+                v.value(),
+            )
+        };
     }
     ${impl_simple_copy('font_stretch', 'mFont.stretch')}
     pub fn clone_font_stretch(&self) -> longhands::font_stretch::computed_value::T {
+        use values::computed::font::FontStretch;
         use values::computed::Percentage;
         use values::generics::NonNegative;
 
         let stretch =
             unsafe { bindings::Gecko_FontStretch_ToFloat(self.gecko.mFont.stretch) };
         debug_assert!(stretch >= 0.);
 
-        NonNegative(Percentage(stretch))
+        FontStretch(NonNegative(Percentage(stretch)))
     }
 
     pub fn set_font_style(&mut self, v: longhands::font_style::computed_value::T) {
         use values::generics::font::FontStyle;
         let s = &mut self.gecko.mFont.style;
         unsafe {
             match v {
                 FontStyle::Normal => bindings::Gecko_FontSlantStyle_SetNormal(s),

--- a/servo/components/style/properties/longhand/font.mako.rs
+++ b/servo/components/style/properties/longhand/font.mako.rs
@@ -79,17 +79,17 @@
                           initial_value="specified::FontSynthesis::get_initial_value()",
                           animation_value_type="discrete",
                           flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
                           spec="https://drafts.csswg.org/css-fonts/#propdef-font-synthesis")}
 
 ${helpers.predefined_type(
     "font-stretch",
     "FontStretch",
-    initial_value="computed::NonNegativePercentage::hundred()",
+    initial_value="computed::FontStretch::hundred()",
     initial_specified_value="specified::FontStretch::normal()",
     animation_value_type="Percentage",
     flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-stretch",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.single_keyword_system("font-kerning",
@@ -330,17 +330,17 @@ https://drafts.csswg.org/css-fonts-4/#lo
         impl ToComputedValue for SystemFont {
             type ComputedValue = ComputedSystemFont;
 
             fn to_computed_value(&self, cx: &Context) -> Self::ComputedValue {
                 use gecko_bindings::bindings;
                 use gecko_bindings::structs::{LookAndFeel_FontID, nsFont};
                 use std::mem;
                 use values::computed::Percentage;
-                use values::computed::font::{FontSize, FontStyle, FontFamilyList};
+                use values::computed::font::{FontSize, FontStretch, FontStyle, FontFamilyList};
                 use values::generics::NonNegative;
 
                 let id = match *self {
                     % for font in system_fonts:
                         SystemFont::${to_camel_case(font)} => {
                             LookAndFeel_FontID::eFont_${to_camel_case(font.replace("-moz-", ""))}
                         }
                     % endfor
@@ -351,19 +351,19 @@ https://drafts.csswg.org/css-fonts-4/#lo
                     bindings::Gecko_nsFont_InitSystem(
                         &mut system,
                         id as i32,
                         cx.style().get_font().gecko(),
                         cx.device().pres_context()
                     )
                 }
                 let font_weight = longhands::font_weight::computed_value::T::from_gecko_weight(system.weight);
-                let font_stretch = NonNegative(Percentage(unsafe {
+                let font_stretch = FontStretch(NonNegative(Percentage(unsafe {
                     bindings::Gecko_FontStretch_ToFloat(system.stretch)
-                }));
+                })));
                 let font_style = FontStyle::from_gecko(system.style);
                 let ret = ComputedSystemFont {
                     font_family: longhands::font_family::computed_value::T(
                         FontFamilyList(
                             unsafe { system.fontlist.mFontlist.mBasePtr.to_safe() }
                         )
                     ),
                     font_size: FontSize {

--- a/servo/components/style/properties/properties.mako.rs
+++ b/servo/components/style/properties/properties.mako.rs
@@ -2300,23 +2300,20 @@ pub mod style_structs {
                     }
                 % endfor
             % elif style_struct.name == "Font":
                 /// Computes a font hash in order to be able to cache fonts
                 /// effectively in GFX and layout.
                 pub fn compute_font_hash(&mut self) {
                     // Corresponds to the fields in
                     // `gfx::font_template::FontTemplateDescriptor`.
-                    //
-                    // FIXME(emilio): Where's font-style?
                     let mut hasher: FnvHasher = Default::default();
-                    // We hash the floating point number with four decimal
-                    // places.
-                    hasher.write_u64((self.font_weight.0 * 10000.).trunc() as u64);
-                    hasher.write_u64(((self.font_stretch.0).0 * 10000.).trunc() as u64);
+                    self.font_weight.hash(&mut hasher);
+                    self.font_stretch.hash(&mut hasher);
+                    self.font_style.hash(&mut hasher);
                     self.font_family.hash(&mut hasher);
                     self.hash = hasher.finish()
                 }
 
                 /// (Servo does not handle MathML, so this just calls copy_font_size_from)
                 pub fn inherit_font_size_from(&mut self, parent: &Self,
                                               _: Option<NonNegativeLength>,
                                               _: &Device) {

--- a/servo/components/style/values/computed/font.rs
+++ b/servo/components/style/values/computed/font.rs
@@ -10,42 +10,47 @@ use byteorder::{BigEndian, ByteOrder};
 use cssparser::{serialize_identifier, CssStringWriter, Parser};
 #[cfg(feature = "gecko")]
 use gecko_bindings::{bindings, structs};
 #[cfg(feature = "gecko")]
 use gecko_bindings::sugar::refptr::RefPtr;
 #[cfg(feature = "gecko")]
 use malloc_size_of::{MallocSizeOf, MallocSizeOfOps};
 use std::fmt::{self, Write};
-#[cfg(feature = "gecko")]
 use std::hash::{Hash, Hasher};
 #[cfg(feature = "servo")]
 use std::slice;
 use style_traits::{CssWriter, ParseError, ToCss};
 use values::CSSFloat;
 use values::animated::{ToAnimatedValue, ToAnimatedZero};
-use values::computed::{Angle, Context, Integer, NonNegativeLength, Number, ToComputedValue};
+use values::computed::{Angle, Context, Integer, NonNegative, NonNegativeLength, NonNegativePercentage};
+use values::computed::{Number, Percentage, ToComputedValue};
 use values::generics::font::{self as generics, FeatureTagValue, FontSettings, VariationValue};
 use values::specified::font::{self as specified, MIN_FONT_WEIGHT, MAX_FONT_WEIGHT};
 use values::specified::length::{FontBaseSize, NoCalcLength};
 
 pub use values::computed::Length as MozScriptMinSize;
 pub use values::specified::font::{FontSynthesis, MozScriptSizeMultiplier, XLang, XTextZoom};
-pub use values::computed::NonNegativePercentage as FontStretch;
 
 /// A value for the font-weight property per:
 ///
 /// https://drafts.csswg.org/css-fonts-4/#propdef-font-weight
 ///
 /// This is effectively just a `Number`.
 #[derive(Clone, ComputeSquaredDistance, Copy, Debug, MallocSizeOf, PartialEq,
          ToCss)]
 #[cfg_attr(feature = "servo", derive(Deserialize, Serialize))]
 pub struct FontWeight(pub Number);
 
+impl Hash for FontWeight {
+    fn hash<H: Hasher>(&self, hasher: &mut H) {
+        hasher.write_u64((self.0 * 10000.).trunc() as u64);
+    }
+}
+
 impl ToAnimatedValue for FontWeight {
     type AnimatedValue = Number;
 
     #[inline]
     fn to_animated_value(self) -> Self::AnimatedValue {
         self.0
     }
 
@@ -848,16 +853,22 @@ impl ToAnimatedValue for FontStyleAngle 
         FontStyleAngle(Angle::Deg(
             animated.degrees()
                 .min(specified::FONT_STYLE_OBLIQUE_MAX_ANGLE_DEGREES)
                 .max(specified::FONT_STYLE_OBLIQUE_MIN_ANGLE_DEGREES)
         ))
     }
 }
 
+impl Hash for FontStyleAngle {
+    fn hash<H: Hasher>(&self, hasher: &mut H) {
+        hasher.write_u64((self.0.degrees() * 10000.).trunc() as u64);
+    }
+}
+
 /// The computed value of `font-style`.
 ///
 /// FIXME(emilio): Angle should be a custom type to handle clamping during
 /// animation.
 pub type FontStyle = generics::FontStyle<FontStyleAngle>;
 
 impl FontStyle {
     /// The `normal` value.
@@ -911,8 +922,48 @@ impl ToCss for FontStyle {
                     dest.write_char(' ')?;
                     angle.to_css(dest)?;
                 }
                 Ok(())
             }
         }
     }
 }
+
+/// A value for the font-stretch property per:
+///
+/// https://drafts.csswg.org/css-fonts-4/#propdef-font-stretch
+#[derive(Clone, ComputeSquaredDistance, Copy, Debug, MallocSizeOf, PartialEq, ToCss)]
+#[cfg_attr(feature = "servo", derive(Deserialize, Serialize))]
+pub struct FontStretch(pub NonNegativePercentage);
+
+impl FontStretch {
+    /// 100%
+    pub fn hundred() -> Self {
+        FontStretch(NonNegativePercentage::hundred())
+    }
+
+    /// The float value of the percentage
+    #[inline]
+    pub fn value(&self) -> CSSFloat {
+        ((self.0).0).0
+    }
+}
+
+impl ToAnimatedValue for FontStretch {
+    type AnimatedValue = Percentage;
+
+    #[inline]
+    fn to_animated_value(self) -> Self::AnimatedValue {
+        (self.0).0
+    }
+
+    #[inline]
+    fn from_animated_value(animated: Self::AnimatedValue) -> Self {
+        FontStretch(NonNegative(animated))
+    }
+}
+
+impl Hash for FontStretch {
+    fn hash<H: Hasher>(&self, hasher: &mut H) {
+        hasher.write_u64((self.value() * 10000.).trunc() as u64);
+    }
+}

--- a/servo/components/style/values/generics/font.rs
+++ b/servo/components/style/values/generics/font.rs
@@ -223,17 +223,17 @@ impl Default for KeywordSize {
     }
 }
 
 /// A generic value for the `font-style` property.
 ///
 /// https://drafts.csswg.org/css-fonts-4/#font-style-prop
 #[allow(missing_docs)]
 #[cfg_attr(feature = "servo", derive(Deserialize, Serialize))]
-#[derive(Animate, Clone, ComputeSquaredDistance, Copy, Debug, MallocSizeOf,
+#[derive(Animate, Clone, ComputeSquaredDistance, Copy, Debug, Hash, MallocSizeOf,
          PartialEq, SpecifiedValueInfo, ToAnimatedValue, ToAnimatedZero)]
 pub enum FontStyle<Angle> {
     #[animation(error)]
     Normal,
     #[animation(error)]
     Italic,
     #[value_info(starts_with_keyword)]
     Oblique(Angle),

--- a/servo/components/style/values/generics/mod.rs
+++ b/servo/components/style/values/generics/mod.rs
@@ -151,17 +151,17 @@ impl SpecifiedValueInfo for CounterStyle
             }
         }
         include!("../../counter_style/predefined.rs");
     }
 }
 
 /// A wrapper of Non-negative values.
 #[cfg_attr(feature = "servo", derive(Deserialize, Serialize))]
-#[derive(Animate, Clone, ComputeSquaredDistance, Copy, Debug, MallocSizeOf,
+#[derive(Animate, Clone, ComputeSquaredDistance, Copy, Debug, Hash, MallocSizeOf,
          PartialEq, PartialOrd, SpecifiedValueInfo, ToAnimatedZero,
          ToComputedValue, ToCss)]
 pub struct NonNegative<T>(pub T);
 
 /// A wrapper of greater-than-or-equal-to-one values.
 #[cfg_attr(feature = "servo", derive(Deserialize, Serialize))]
 #[derive(Animate, Clone, ComputeSquaredDistance, Copy, Debug, MallocSizeOf,
          PartialEq, PartialOrd, SpecifiedValueInfo, ToAnimatedZero,

--- a/servo/components/style/values/specified/font.rs
+++ b/servo/components/style/values/specified/font.rs
@@ -485,32 +485,32 @@ impl Parse for FontStretch {
             return Ok(FontStretch::Stretch(percentage));
         }
 
         Ok(FontStretch::Keyword(FontStretchKeyword::parse(input)?))
     }
 }
 
 impl ToComputedValue for FontStretch {
-    type ComputedValue = NonNegative<ComputedPercentage>;
+    type ComputedValue = computed::FontStretch;
 
     fn to_computed_value(&self, context: &Context) -> Self::ComputedValue {
         match *self {
             FontStretch::Stretch(ref percentage) => {
-                NonNegative(percentage.to_computed_value(context))
+                computed::FontStretch(NonNegative(percentage.to_computed_value(context)))
             },
             FontStretch::Keyword(ref kw) => {
-                NonNegative(kw.compute())
+                computed::FontStretch(NonNegative(kw.compute()))
             },
             FontStretch::System(_) => self.compute_system(context),
         }
     }
 
     fn from_computed_value(computed: &Self::ComputedValue) -> Self {
-        FontStretch::Stretch(Percentage::from_computed_value(&computed.0))
+        FontStretch::Stretch(Percentage::from_computed_value(&(computed.0).0))
     }
 }
 
 #[derive(Clone, Debug, MallocSizeOf, PartialEq, SpecifiedValueInfo, ToCss)]
 /// A specified font-size value
 pub enum FontSize {
     /// A length; e.g. 10px.
     Length(LengthOrPercentage),