prismspecs prismspecs - 6 months ago 7
CSS Question

content before and after for links, make that unclickable

I've searched tirelessly for this and am very surprised to not find an answer.

Very simply question: I have a link being rolled out via WPress and I'd like to wrap some characters around it for emphasis, but I don't want those characters to be part of the link. Aka, for:

a:before {
content: " - ";

it produces

<a href="X"> - link text</a>

when I want

- <a href="X">link text</a>



you may use a positive/negative margin and pointer-events

a {
  margin-left: 1em;
a:before {
  content: '- ';
<a href="X">link text</a>

<a href="X">Another link text</a>