| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head> |
| <title>CSS Test: counter-* properties with a calc() expression</title> |
| <link rel="author" title="Ondřej Žára" href="https://ondras.zarovi.cz/"/> |
| |
| <link rel="help" href="https://www.w3.org/TR/CSS21/generate.html#counters"/> |
| <link rel="help" href="https://www.w3.org/TR/CSS21/generate.html#propdef-content"/> |
| <link rel="help" href="https://www.w3.org/TR/CSS21/syndata.html#counter"/> |
| <link rel="help" href="https://www.w3.org/TR/css-values-3/#calc-notation"/> |
| <link rel="help" href="https://www.w3.org/TR/css-lists-3/#counter-properties"/> |
| <link rel="match" href="calc-in-counter-001-ref.xhtml"/> |
| <style type="text/css"> |
| |
| body { |
| white-space: nowrap; |
| } |
| |
| #a { counter-reset: a calc(3 + 5); } |
| #a::before { content: counter(a); } |
| |
| #b { counter-reset: b 0; counter-increment: b calc(4 + 6); } |
| #b::before { content: counter(b); } |
| |
| </style> |
| </head> |
| <body> |
| |
| <p>The following two lines should be the same:</p> |
| |
| <div id="test"> |
| <span id="a"></span> |
| <span id="b"></span> |
| </div> |
| |
| <div id="reference"> |
| <span>8</span> |
| <span>10</span> |
| </div> |
| |
| </body> |
| </html> |