Removing links underline in the gaps

Question

Sorry form my English.

Hi, I am in some references use FontAwesome and I need between the icon and remove the underlining text links, is there such a possibility?

<p><a href="#"><i class="fa fa-user"></i> Username</a></p>

Pattern in JSFiddle

Answer 1

Remove the space and use padding inside the i tag

a:hover {text-decoration:none;}
a i {text-decoation:none; padding-right:5px}

http://jsfiddle.net/jEh6J/2/