Предотвратить селектор :: after как часть ссылки?

Question

Гуглил себя глупо, все еще не мог найти никакой информации об этом. Следующая проблема:

Добавление селектора :: after для ссылки добавляет его как часть ссылки. Есть ли способ, которым селектор :: after не будет расширять ссылку (быть только текстовым, а не кликабельным)? Посмотрите пример, есть ли способ, чтобы "» "не было частью ссылки?

Пример:

a::after {
  content: " »";
}

<a href="#">Test</a>

Answer 1

Сделайте ширину 0 и добавьте pointer-events: none;

a::after {
  content: " »";
  display:inline-block;
  margin-left:8px;
  width:0;    
  pointer-events: none;
}

a {
  font-size:35px;
  margin-right:20px; /* to avoid overflow issue and cover the area of the pseudo element */
}

<a href="#">Test</a> some text after