Pure CSS Lists

This is a nice way to make a list have the proper Oxford comma no matter what. Useful if you’re using a templating engine and don’t want to bother with Intl.ListFormat

The only issue I see with this is that it’s playing with pseudo-elements so selecting the text is weird.

<span
	class="
	before:content-[',_']
	only:before:content-['']
	first:before:content-['']
	last:before:content-[',_and_']
	last:[&:nth-child(2)]:before:content-['_and_']
	"
>
	Item 1
</span>

Here it is in action 😎