Spacing in CSS pseudo-element content

A bit of an abstract title but I’m basically taking about:

h4::after {
    content: "";
}

If you have just text in the content property, you can adjust spacing with the letter-spacing and/or word-spacing properties in CSS. Letter-spacing would even work if you have just icons but I had a combination of three icons and a word, and the letter-spacing I wanted between the icons pulled the letters of the word too far apart. You can’t use html in the content property of a pseudo-element like ::before or :: after, so   is out.

What: I found my solution on Stack Overflow, see link below, where someone had given a pretty list of the different spaces in CSS as a solution to a similar problem.

h4::after {
    content: "Hello\2002\f0ac";
}

With \2002 representing an en-space and \f0ac a FontAwesome icon of a globe.

Where: Answer on Stack Overflow by Zer00ne

More: The best resource I’ve found so far is HTML Symbols – Unicode symbols, entities & codes. It’s vast and comprehensive.

---

Photo by Martim Braz on Unsplash