tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

text-indent-each-line-hanging.html (2102B)


      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4    <meta charset="utf-8">
      5    <title>text-indent 'each-line' and 'hanging' modifiers</title>
      6    <link rel="author" title="Jaehun Lim" href="mailto:ljaehun.lim@samsung.com">
      7    <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property">
      8    <link rel="match" href="reference/text-indent-each-line-hanging-ref.html">
      9    <meta name="assert" content="'each-line' and 'hanging' properly works">
     10 
     11    <link rel="stylesheet" href="/fonts/ahem.css" />
     12    <style>
     13    div { width:80px; font: 10px Ahem; background-color:lightgray; }
     14    .normal { text-indent: 4em; }
     15    .eachline { text-indent: 4em each-line; }
     16    .hanging { text-indent: 4em hanging; }
     17    .eachlinehanging { text-indent: 4em each-line hanging; }
     18    .indent { color: blue; }
     19    </style>
     20 </head>
     21 <body>
     22 All black boxes should be left-aligned. All blue boxes should be right-aligned.
     23 
     24 <!-- normal text-indent -->
     25 <div class="normal">
     26 <span class="indent">xxxx</span> xxxx<br>xxxx
     27 </div>
     28 <br>
     29 <!-- each-line with a soft wrap break -->
     30 <div class="eachline">
     31 <span class="indent">xxxx</span> xxxx xxxx
     32 </div>
     33 <br>
     34 <!-- each-line with a forced line break -->
     35 <div class="eachline">
     36 <span class="indent">xxxx</span><br><span class="indent">xxxx</span><br><span class="indent">xxxx</span>
     37 </div>
     38 <br>
     39 <!-- each-line with a soft wrap break and a forced line break -->
     40 <div class="eachline">
     41 <span class="indent">xxxx</span> xxxx<br><span class="indent">xxxx</span>
     42 </div>
     43 <br>
     44 <!-- normal text-indent with hanging -->
     45 <div class="hanging">
     46 xxxx <span class="indent">xxxx</span><br><span class="indent">xxxx</span>
     47 </div>
     48 <br>
     49 <!-- each-line and hanging with a soft wrap break -->
     50 <div class="eachlinehanging">
     51 xxxx <span class="indent">xxxx</span> <span class="indent">xxxx</span>
     52 </div>
     53 <br>
     54 <!-- each-line and hanging with a forced line break -->
     55 <div class="eachlinehanging">
     56 xxxx<br>xxxx<br>xxxx
     57 </div>
     58 <br>
     59 <!-- each-line and hanging with a soft wrap break and a forced line break -->
     60 <div class="eachlinehanging">
     61 xxxx <span class="indent">xxxx</span><br>xxxx
     62 </div>
     63 </body>
     64 </html>