third_party/WebKit/LayoutTests/fast/css/line-height-determined-by-primary-font.html

   1 <!doctype html>
   2 <html>
   3     <head>
   4         <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
   5         <style>
   6             body {
   7                 font-size:12px;
   8             }
   9
  10             .container ul {
  11                 width:527px;
  12                 height:97px;
  13                 list-style:none;
  14                 line-height:30px;
  15             }
  16
  17             .container ul li {
  18                 float:left;
  19                 padding:0 10px 0 12px;
  20                 display:inline;
  21                 border-bottom: 1px solid red;
  22             }
  23
  24             .container ul .li_f1 {
  25                 font-size:14px
  26             }
  27
  28             .container ul .li_f2 {
  29                 font-size:14px;
  30             }
  31
  32             .container ul .li_f3 {
  33                 font-size:18px;
  34             }
  35
  36             .container ul .li_f3_2 {
  37                 font-size:18px
  38             }
  39
  40             .container ul .li_f4 {
  41                 font-size:24px;
  42             }
  43         </style>
  44     </head>
  45     <body>
  46         <p>This test verifies that line height is determined solely by a box's primary font, not by its fallback fonts. The following two lines should have a solid, unbroken red line below them:</p>
  47         <div class="container">
  48             <ul>
  49                 <li class="li_f1"><a>±õÆé²½</a></li>
  50                 <li class="li_f3"><a>²ÌÒÀÁÖ</a></li>
  51                 <li class="li_f4"><a>³Âç²Õê</a></li>
  52                 <li class="li_f3"><a>³ÂÞÈÑ¸</a></li>
  53                 <li><a>ºÚÑ¼×Ó</a></li>
  54                 <li class="li_f2"><a>ÀîÓî´º</a></li>
  55                 <li class="li_f1"><a>Áº¾²Èã</a></li>
  56             </ul>
  57         </div>
  58         <div class="container">
  59             <ul>
  60                 <li class="li_f1">±õÆé²½</li>
  61                 <li class="li_f3">²ÌÒÀÁÖ</li>
  62                 <li class="li_f4">³Âç²Õê</li>
  63                 <li class="li_f3">³ÂÞÈÑ¸</li>
  64                 <li >ºÚÑ¼×Ó</li>
  65                 <li class="li_f2">ÀîÓî´º</li>
  66                 <li class="li_f1">Áº¾²Èã</li>
  67             </ul>
  68         </div>
  69     </body>
  70 </html>