third_party/WebKit/LayoutTests/fast/css/font-shorthand-line-height.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/js-test.js"></script>
   3 <style>
   4     #system_font_1 { font: caption; line-height: 100px; }
   5     #system_font_2 { line-height: 100px; font: caption; }
   6
   7     #shorthand_normal_1 { font: 10px monospace; line-height: 100px; }
   8     #shorthand_normal_2 { line-height: 100px; font: 10px monospace; }
   9
  10     #shorthand_line_height_1 { font: 10px/200px monospace; line-height: 100px; }
  11     #shorthand_line_height_2 { line-height: 100px; font: 10px/200px monospace; }
  12 </style>
  13 <div id="system_font_1"></div>
  14 <div id="system_font_2"></div>
  15 <div id="shorthand_normal_1"></div>
  16 <div id="shorthand_normal_2"></div>
  17 <div id="shorthand_line_height_1"></div>
  18 <div id="shorthand_line_height_2"></div>
  19 <script>
  20     description("Test that line-height in font shorthands cascades correctly.");
  21
  22     function lineHeight(target) {
  23         return getComputedStyle(target).lineHeight;
  24     }
  25
  26     shouldBe("lineHeight(system_font_1)", "'100px'");
  27     shouldBe("lineHeight(system_font_2)", "'normal'");
  28     shouldBe("lineHeight(shorthand_normal_1)", "'100px'");
  29     shouldBe("lineHeight(shorthand_normal_2)", "'normal'");
  30     shouldBe("lineHeight(shorthand_line_height_1)", "'100px'");
  31     shouldBe("lineHeight(shorthand_line_height_2)", "'200px'");
  32 </script>