layout/reftests/css-calc/line-height-1-ref.html

   1 <!DOCTYPE html>
   2 <style>
   3 div {
   4  width:100px;
   5  height:600px;
   6  margin:5px 0 0 5px;
   7  font-size: 30px;
   8  float:left;
   9 }
  10 div#one {
  11  line-height: 300%;
  12 }
  13 div#two {
  14  line-height: 100px;
  15 }
  16 div#three {
  17  line-height: 110px;
  18 }
  19 div#four {
  20  line-height: 20px;
  21 }
  22 div#five {
  23  line-height: 12px;
  24 }
  25 div#six {
  26  line-height: 12px;
  27 }
  28 div#seven {
  29  line-height: 12px;
  30 }
  31 div#eight {
  32  line-height: 12px;
  33 }
  34 div#nine {
  35  line-height: 12px;
  36 }
  37 div#nine {
  38  line-height: 12px;
  39 }
  40 div#ten {
  41  line-height: 12px;
  42 }
  43 div#div-11 {
  44  line-height: 15px;
  45 }
  46 div#div-12 {
  47  line-height: 195px;
  48 }
  49 </style>
  50 <div id="one">line height is 300%</div>
  51 <div id="two">line height is 100px</div>
  52 <div id="three">line height is 50px</div>
  53 <div id="four">line height is 10px * 2</div>
  54 <div id="five">line height is 50% - 3px</div>
  55 <div id="six">line height is 25% - 3px + 25%</div>
  56 <div id="seven">line height is 25% - 3px + 12.5% * 2</div>
  57 <div id="eight">line height is 25% - 3px + 12.5%*2</div>
  58 <div id="nine">line height is 25% - 3px + 2*12.5%</div>
  59 <div id="ten">line height is 25% - 3px + 2 * 12.5%</div>
  60 <div id="div-11">line height is 30% + 20%</div>
  61 <div id="div-12">line height is 3 * 2 + 3 / 6</div>
  62 </html>