counter-003.html (1346B)
1 <!doctype html> 2 <title>CSS Lists and Counters: counter(c, ".", upper-roman)</title> 3 <link rel="help" href="https://drafts.csswg.org/css-lists/#inheriting-counters"> 4 <link rel="match" href="counter-003-ref.html"> 5 <meta name="assert" content="counters are not inherited from the previous sibling, when can be inherited from the ancestor"> 6 <style type="text/css"> 7 #test { counter-reset: c; } 8 #test span { counter-increment: c; } 9 #test span::before { content: counter(c, upper-roman); } 10 </style> 11 <p>The following two lines should look the same:</p> 12 <div id="test"> 13 <span></span> 14 <span></span> 15 <span></span> 16 <span></span> 17 <span></span> 18 <span></span> 19 <span></span> 20 <span></span> 21 <span></span> 22 <span></span> 23 <span></span> 24 <span></span> 25 <span style="counter-reset: c 48"></span> 26 <span></span> 27 <span style="counter-reset: c 388"></span> 28 <span></span> 29 <span style="counter-reset: c 3488"></span> 30 <span></span> 31 <span></span> 32 </div> 33 <div> 34 <span>I</span> 35 <span>II</span> 36 <span>III</span> 37 <span>IV</span> 38 <span>V</span> 39 <span>VI</span> 40 <span>VII</span> 41 <span>VIII</span> 42 <span>IX</span> 43 <span>X</span> 44 <span>XI</span> 45 <span>XII</span> 46 <span>XLIX</span> 47 <span>XIII</span> 48 <span>CCCLXXXIX</span> 49 <span>XIV</span> 50 <span>MMMCDLXXXIX</span> 51 <span>XV</span> 52 <span>XVI</span> 53 </div>