marker-content-023.html (1274B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Test: ::marker pseudo elements styled with 'content' property</title> 4 <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com"> 5 <link rel="match" href="marker-content-023-ref.html"> 6 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo"> 7 <link rel="help" href="https://drafts.csswg.org/css-text/#text-indent-property"> 8 <meta name="assert" content="Checks that 'text-indent' doesn't apply nor inherit to ::marker."> 9 <style> 10 li { 11 text-indent: 100px; /* Should not be inherited by ::marker */ 12 } 13 ::marker { 14 text-indent: 100px; /* Should have no effect */ 15 } 16 li > div { 17 text-indent: 0; 18 } 19 .disc { 20 list-style-type: disc; 21 } 22 .decimal { 23 list-style-type: decimal; 24 } 25 .string { 26 list-style-type: "3. "; 27 } 28 .content::marker { 29 content: "4. "; 30 } 31 .rtl-marker ::marker { 32 direction: rtl; 33 } 34 </style> 35 <ol> 36 <li class="disc"><div>disc</div></li> 37 <li class="decimal"><div>decimal</div></li> 38 <li class="string"><div>string</div></li> 39 <li class="content"><div>content</div></li> 40 </ol> 41 <ol class="rtl-marker"> 42 <li class="disc"><div>disc</div></li> 43 <li class="decimal"><div>decimal</div></li> 44 <li class="string"><div>string</div></li> 45 <li class="content"><div>content</div></li> 46 </ol>