variable-reference-without-whitespace.html (1602B)
1 <!DOCTYPE html> 2 <title>Variable reference without whitespace</title> 3 <link rel=match href=reference/variable-reference-without-whitespace-ref.html> 4 <link rel=help href=http://www.w3.org/TR/css-variables-1/#syntax> 5 <link rel=author title="Simon Sapin" href=http://exyr.org/about/> 6 <meta rel=assert content=" 7 A variable reference followed by something without whitespace in between 8 must not be interpreted together as a single identifier. 9 Custom property values are sequences of tokens, not strings."> 10 <style> 11 p { 12 counter-reset: -- --a -a; 13 --dash:-; 14 } 15 16 #test_1 span::before { 17 counter-increment: var(--dash)-; 18 content: counter(--); 19 } 20 #test_2 span::before { 21 counter-increment: var(--dash)-a; 22 content: counter(--a); 23 } 24 #test_3 span::before { 25 counter-increment: var(--dash)a; 26 content: counter(-a); 27 } 28 29 #control_1 span::before { 30 counter-increment: --; 31 content: counter(--); 32 } 33 #control_2 span::before { 34 counter-increment: --a; 35 content: counter(--a); 36 } 37 #control_3 span::before { 38 counter-increment: -a; 39 content: counter(-a); 40 } 41 </style> 42 <p>The next four lines must be identical, containing only zeroes: 43 <p id="test_1"><span></span> <span></span> <span></span> 44 <p id="test_2"><span></span> <span></span> <span></span> 45 <p id="test_3"><span></span> <span></span> <span></span> 46 <p>0 0 0 47 48 <p>The next four lines must be identical, containing increasing integers: 49 <p id="control_1"><span></span> <span></span> <span></span> 50 <p id="control_2"><span></span> <span></span> <span></span> 51 <p id="control_3"><span></span> <span></span> <span></span> 52 <p>1 2 3