Stop snapping from creating a font?

For some reason, whenever I make a font with an awesome icon, it's inside the anchor, it turns blue, and I can't turn it off in the usual way using css:

a {
    text-decoration:none;
}

      

Here is the link to the codepen, as you can see the github icon is blue in the footer:

http://codepen.io/EuanR/pen/XbOdgR

+3


source to share


5 answers


You can add the following CSS to make the link inherit the color of the text around it:



a {
  color:inherit;
}

      

+3


source


The problem is that it text-decoration:none;

doesn't prevent the color reference from changing; it just prevents underlining.

To prevent color change, you need to override the color:



a {
   text-decoration:none;
   color: inherit;
}

      

And it is not related or caused by the font awesome

0


source


FontAwesome icons are injected in tags <i>

, you can just call the tag <i>

.

i{
  color:red;
}

      

0


source


You need to specify the color attribute:

a {
    text-decoration:none;
    color: black;
}

      

or if you want the rest of the link to be blue, but the icon is a different color:

a i {
    text-decoration:none;
    color: black;
}

      

0


source


Of course, just set the color from the link:

.modal-footer a {
  color:red;
}

      

example codepen

0


source







All Articles