lolikols lolikols - 1 year ago 113
CSS Question

Importing a google font via CSS

I'm trying to use a google font in my website. I've used this before:

@import url(;
#MasterHeaderWrap .TopNav .rtsLevel1 .rtsLink .rtsTxt { font-family: 'Cantata One', serif !important; text-transform: uppercase !important;}

And it worked to change the font. The correct font was displaying. However, when I try to use the same format for this font:

@import url(;
#MasterHeaderWrap .TopNav .rtsLevel1 .rtsLink .rtsTxt { font-family: 'Exo', sans-serif !important; text-transform: uppercase !important;}

It's not displaying properly. I mean the font changes, but it's definitely not Exo. Can anyone advise?

Just as a disclaimer here, I don't have access to the HTML backend, I only have access to a CSS editor on the website, so all I can do is plug in these css snippets.

Edit: I got it! All I had to do was rearrange my code. Thank you guys! You're all magicians in my book!

Answer Source

Try with this:

@import url(;

#MasterHeaderWrap .TopNav .rtsLevel1 .rtsLink .rtsTxt {
    font-family: 'Exo Regular', sans-serif !important; text-transform: uppercase !important;
  /*------------------^^^^^^^ */


Well, I think you have your website through HTTP, so the request to google fonts needs to be HTTP and not HTTPS, so this works:

@import url(;
/* ------------^^*/
#MasterHeaderWrap .TopNav .rtsLevel1 .rtsLink .rtsTxt {
    font-family: 'Exo', sans-serif !important; text-transform: uppercase !important;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download