third_party/WebKit/LayoutTests/css2.1/20110323/text-indent-014.htm

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3 <head>
   4   <title>CSS Test: text-indent on anonymous blocks</title>
   5   <script src="../../resources/ahem.js"></script>
   6   <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
   7   <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#indentation-prop">
   8   <meta name="flags" content="">
   9   <meta name="assert" content="text-indent affects only the first line of     a block container if that line is also the first formatted line of an     element.">
  10   <style type="text/css">
  11     .container {
  12       font: 20px/1 Ahem;
  13       border: solid orange;
  14       width: 12em;
  15     }
  16     .outer {
  17       text-indent: 6em;
  18     }
  19     .inner {
  20       text-indent: 0;
  21     }
  22     .outer {
  23     }
  24     .outer:before {
  25       content: "BlockA";
  26       display: block;
  27     }
  28
  29     .controlA, .controlB {
  30       background: red;
  31       height: 3em;
  32       width: 6em;
  33     }
  34     .controlA {
  35       margin-left: 6em;
  36       margin-bottom: -3em;
  37     }
  38     .controlB {
  39       margin-top: -3em;
  40     }
  41   </style>
  42 </head>
  43 <body>
  44   <p>There must be a 4-square checkerboard pattern in the orange box below
  45     and no red present.</p>
  46   <div class="container">
  47     <div class="controlA"></div>
  48     <div class="outer">
  49       <div>
  50         BlockA
  51         <div>BlockA</div>
  52         BlockB
  53         <div class="inner">BlockB</div>
  54         BlockB
  55       </div>
  56     </div>
  57     <div class="controlB"></div>
  58   </div>
  59 </body>
  60 </html>