| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <title>[css3-text] text-indent</title> | 3 <title>[css3-text] text-indent</title> |
| 4 <style> | 4 <style> |
| 5 div { width:80px; font: 10px Ahem; background-color:lightgray; } | 5 div { width:80px; font: 10px Ahem; background-color:lightgray; } |
| 6 .normal { text-indent: 4em; } | 6 .normal { text-indent: 4em; } |
| 7 .eachline { width:80px; text-indent: 4em each-line; } | 7 .eachline { text-indent: 4em each-line; } |
| 8 .hanging { text-indent: 4em hanging; } |
| 9 .eachlinehanging { text-indent: 4em each-line hanging; } |
| 8 .indent { color: blue; } | 10 .indent { color: blue; } |
| 9 </style> | 11 </style> |
| 10 </head | 12 </head |
| 11 <body> | 13 <body> |
| 12 <!-- | 14 <!-- |
| 13 all black boxes should be left-aligned. | 15 all black boxes should be left-aligned. |
| 14 all blue boxes should be right-aligned. | 16 all blue boxes should be right-aligned. |
| 15 --> | 17 --> |
| 16 | 18 |
| 17 <!-- normal text-indent --> | 19 <!-- normal text-indent --> |
| 18 <div class="normal"> | 20 <div class="normal"> |
| 19 <span class="indent">xxxx</span><br>xxxx<br>xxxx | 21 <span class="indent">xxxx</span> xxxx<br>xxxx |
| 20 </div> | 22 </div> |
| 21 <br> | 23 <br> |
| 22 <!-- each-line with a soft wrap break --> | 24 <!-- each-line with a soft wrap break --> |
| 23 <div class="eachline"> | 25 <div class="eachline"> |
| 24 <span class="indent">xxxx</span> xxxx xxxx | 26 <span class="indent">xxxx</span> xxxx xxxx |
| 25 </div> | 27 </div> |
| 26 <br> | 28 <br> |
| 27 <!-- each-line with a forced line break --> | 29 <!-- each-line with a forced line break --> |
| 28 <div class="eachline"> | 30 <div class="eachline"> |
| 29 <span class="indent">xxxx</span><br><span class="indent">xxxx</span><br><span cl
ass="indent">xxxx</span> | 31 <span class="indent">xxxx</span><br><span class="indent">xxxx</span><br><span cl
ass="indent">xxxx</span> |
| 30 </div> | 32 </div> |
| 31 <br> | 33 <br> |
| 32 <!-- each-line with a soft wrap break and a forced line break --> | 34 <!-- each-line with a soft wrap break and a forced line break --> |
| 33 <div class="eachline"> | 35 <div class="eachline"> |
| 34 <span class="indent">xxxx</span> xxxx<br><span class="indent">xxxx</span> | 36 <span class="indent">xxxx</span> xxxx<br><span class="indent">xxxx</span> |
| 35 </div> | 37 </div> |
| 38 <br> |
| 39 <!-- normal text-indent with hanging --> |
| 40 <div class="hanging"> |
| 41 xxxx <span class="indent">xxxx</span><br><span class="indent">xxxx</span> |
| 42 </div> |
| 43 <br> |
| 44 <!-- each-line and hanging with a soft wrap break --> |
| 45 <div class="eachlinehanging"> |
| 46 xxxx <span class="indent">xxxx</span> <span class="indent">xxxx</span> |
| 47 </div> |
| 48 <br> |
| 49 <!-- each-line and hanging with a forced line break --> |
| 50 <div class="eachlinehanging"> |
| 51 xxxx<br>xxxx<br>xxxx |
| 52 </div> |
| 53 <br> |
| 54 <!-- each-line and hanging with a soft wrap break and a forced line break --> |
| 55 <div class="eachlinehanging"> |
| 56 xxxx <span class="indent">xxxx</span><br>xxxx |
| 57 </div> |
| 36 </body> | 58 </body> |
| 37 </html> | 59 </html> |
| OLD | NEW |