1

I am trying to add metadata to html, and show link from ::before {} element.

<div>
    lorem
    <span data-discussion="https://stackoverflow.com/questions/19826249/html-link-correct-placement>
        ipsum
    </span>
<div>

[data-discussion]:hover::before{
    background: pink;
    content: attr(data-discussion);
    /* link be here! */
}

The ::before attribute is really convenient, as I am able to apply it to the whole page without rewriting my html. Is there a way to add href-like link to it?

Uri Kutner
  • 476
  • 4
  • 13

1 Answers1

1

No, that is not possible with just CSS, you would have to generate a tags , for example with JavaScript.

jplatte
  • 1,121
  • 11
  • 21
  • 2
    pseudo-elements are not part of the DOM and you can't bind any events directly to them, you can only bind to their parent elements. – Edvards Niedre Feb 16 '20 at 17:07