A shorter solution is possible with an ordered list (<ol>) if we're willing to ignore the untidy output:
li:nth-child(3n), li:nth-child(5n) { list-style: none }
li:nth-child(3n)::before { content: "Fizz" }
li:nth-child(5n)::after { content: "Buzz" }
Example: https://susam.net/code/web/css-fizz-buzz-ol.html $ curl -sS https://susam.net/code/web/css-fizz-buzz-ol.html | sed -n '/none/,/after/p' | tr -d '[:space:]'
li:nth-child(3n),li:nth-child(5n){list-style:none}li:nth-child(3n)::before{content:"Fizz"}li:nth-child(5n)::after{content:"Buzz"}
$ curl -sS https://susam.net/code/web/css-fizz-buzz-ol.html | sed -n '/none/,/after/p' | tr -d '[:space:]' | wc -c
129
But I don't quite like how misaligned the numbers and the words look in this version. Correcting that would call for extra code that would cancel out the characters saved.