What's the best way to get a space between the link/paragraph and the icon?
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<a href="#/upgrade/selection"><i class="fa fa-reply"></i>Change</a>
Doesn't work to just put a space before the text because it will be changed back when you minify/uglify the project.
I tried with all kinds of padding and margins. Can't get them to separate.
Best Answer
I would use the
.fa-fw
class. For example:<i class="fa fa-cog fa-fw">
This adds a visual space (that won't get stripped out) and it's consistent, so when/if the elements stack it looks a lot better.Instructions: https://fontawesome.com/how-to-use/on-the-web/styling/fixed-width-icons