title: “text-decoration” and the “:after” pseudo-element, revisited
body: <p>I'm re-asking <a href="https://stackoverflow.com/questions/1180910/text-decoration-and-the-after-pseudo-element">this question</a> because its answers didn't work in my case.</p>
  
  <p>In my stylesheet for printed media I want to append the url after every link using the <code>:after</code> pseudo-class.</p>
  
  <pre><code>a:after {
      content: " &lt;" attr(href) "&gt;";
      text-decoration: none;
      color: #000000;
  }
  </code></pre>
  
  <p>In Firefox (and probably Chrome but not IE8), <code>text-decoration: none</code> is ignored, and the underline stretches unattractively across the bottom of the url. The <code>color</code> however is correctly set to black for the url. Is there a way to make the <code>text-decoration</code> work?</p>
  
  <p>The <a href="https://stackoverflow.com/questions/1180910/text-decoration-and-the-after-pseudo-element">original question</a> appended fixed size images instead of variable width text. Its answers use padding and background images to avoid having to use the text-decoration property. I'm still looking for a solution when the content is variable width text.</p>