text-indent-014.xht (1714B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 2 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <title>CSS Test: text-indent on anonymous blocks</title> 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 <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"/> 9 <link rel="match" href="text-indent-014-ref.xht"/> 10 <meta name="assert" content="text-indent affects only the first line of 11 a block container if that line is also the first formatted line of an 12 element."/> 13 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 14 <style type="text/css"><![CDATA[ 15 .container { 16 font: 20px/1 Ahem; 17 border: solid orange; 18 width: 12em; 19 } 20 .outer { 21 text-indent: 6em; 22 } 23 .inner { 24 text-indent: 0; 25 } 26 .outer { 27 } 28 .outer:before { 29 content: "BlockA"; 30 display: block; 31 } 32 33 .controlA, .controlB { 34 background: red; 35 height: 3em; 36 width: 6em; 37 } 38 .controlA { 39 margin-left: 6em; 40 margin-bottom: -3em; 41 } 42 .controlB { 43 margin-top: -3em; 44 } 45 ]]></style> 46 </head> 47 <body> 48 <p>There must be a 4-square checkerboard pattern in the orange box below 49 and no red present.</p> 50 <div class="container"> 51 <div class="controlA"></div> 52 <div class="outer"> 53 <div> 54 BlockA 55 <div>BlockA</div> 56 BlockB 57 <div class="inner">BlockB</div> 58 BlockB 59 </div> 60 </div> 61 <div class="controlB"></div> 62 </div> 63 </body> 64 </html>