Boundary bottom padding on anchor label

Question

I have an anchor tag inside the header, and I'm trying to put a frame on the anchor tag, which works, however, the filling at the bottom is too large and the negative indentation does not work, how can I get around this?

live site

HTML

<div id="featureText"> <h1>Recent Works / <a href="#">All</a></h1> </div> 

CSS

 #featureText a { color: #414042; text-decoration: none; border-bottom: solid 2px #414042; padding-bottom: -2px; } 

Answer 1

 #featureText a { line-height: 1em; display: inline-block; color: #414042; text-decoration: none; border-bottom: solid 2px #414042; padding: 0; } 

Answer 2

I would suggest:

 #featureText h1 a { /* all your other CSS... */ display: inline-block; line-height: 1em; }