title: How does Wired magazine achieve this thick underline link effect?
body: <p>I noticed recently that Wired magazine has a blue underline for their links that is thick, crosses over text descenders, and a different colour from the text. Here's a <a href="http://www.wired.com/2014/07/art-science-and-an-insect-renaissance/" rel="nofollow">random page</a> for an example.</p>
  
  <p>I don't think this is done with a <code>bottom-border</code>, because it overlaps the text descenders. The colour different might be done with the new <code>-moz-text-decoration-color</code> and <code>text-decoration-color</code> declarations, but I can't determine if there's anything that helps one control the line thickness.</p>
  
  <p>I have, of course, tried to go forensic by analyzing <a href="http://www.wired.com/wp-content/vendor/condenast/pangea/themes/wired/assets/css/wired-post.css?ver=1405035264" rel="nofollow">their CSS</a>, but it's minimized and complicated, and I can't machette my way through all the brush to get at the information I need. I tried searching for key terms like  <code>-moz-text-decoration-color</code> and <code>border-bottom</code>, but with no success.</p>
  
  <p>Anyone know how they do it?</p>