text-align-justify-tabs-002.html (969B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>text-align: justify and preserved tabs</title> 6 <link rel='match' href='reference/text-align-justify-tabs-002-ref.html'> 7 <link rel='author' title='Jonathan Kew' href='mailto:jkew@mozilla.com'> 8 <link rel='help' href='https://www.w3.org/TR/css-text-4/#text-align-property'> 9 <meta name="assert" content="If an element’s white space is not collapsible ... 10 ensure that tab stops continue to line up as required by the white space processing rules."> 11 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css"> 12 13 <style> 14 div { 15 font: 25px Ahem, monospace; 16 width: 30ch; 17 white-space: pre-wrap; 18 tab-size: 8; 19 border: 1px solid gray; 20 padding: 2px; 21 margin: 2px; 22 } 23 .test { 24 text-align: justify; 25 } 26 </style> 27 </head> 28 29 <body> 30 <p>The layout in the two boxes should be the same:</p> 31 <div>a b c	tab 1	tab 2 jklmno<br>pqrs</div> 32 <div class=test>a b c	tab 1	tab 2 jklmno pqrs</div> 33 </body>