LayoutTests/fast/css/empty-inline-line-height-first-line-quirksmode.htm

   1 <html>
   2
   3  <head>
   4
   5   <title>This is a quirks-mode version of empty-inline-line-height-first-line.htm from the CSS 2.1 test suite</title>
   6
   7   <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
   8   <link rel="author" title="Robert Hogan" href="robert[at]roberthogan.net">
   9   <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
  10   <link rel="author" title="Bruno Fassino" href="fassino[at]gmail.com">
  11   <meta content="The line-height of an empty inline element with a first-line pseudo-element is evaluated separately from the line-height of subsequent lines" name="assert">
  12   <meta content="" name="flags">
  13
  14   <style type="text/css">
  15   #test
  16   {
  17   background-color: lime;
  18   line-height: 1;
  19   }
  20
  21   #empty-inline-element
  22   {
  23   line-height: 10;
  24   }
  25
  26   #test:first-line
  27   {
  28   line-height: 5;
  29   }
  30
  31   #reference-overlapped-red
  32   {
  33   background-color: red;
  34   left: 0;
  35   line-height: 15;
  36   position: absolute;
  37   top: 0;
  38   width: 100%;
  39   z-index: -1;
  40   }
  41
  42   #relatively-positioned-wrapper
  43   {
  44   position: relative;
  45   }
  46   </style>
  47
  48  </head>
  49
  50  <body style="font: 16px Ahem;">
  51
  52 <!--In quirks mode there should be a green rectangle with a red rectangle of equal width but greater height below it, each contains a black box (X in ahem font).-->
  53
  54   <div id="relatively-positioned-wrapper">
  55
  56    <div id="test">
  57         <span></span><br>
  58         <span id="empty-inline-element"></span>X
  59    </div>
  60
  61    <div id="reference-overlapped-red">X</div>
  62
  63   </div>
  64
  65  </body>
  66 </html>