CODEWITHSUNDEEP
htmlcssfontsgoogle-fonts
Life4ants
Life4ants

Reputation: 693

Google fonts working on live server but not on localhost

My google fonts display fine on my live website, but in production on localhost, they show differently. More boxy/standard, but not the same as the standard font.

How they show on localhost:

How they show on localhost

How they show on live server (this is want I want):

How they show on live server

Here's my CSS:

@import url('https://fonts.googleapis.com/css?family=Droid+Sans|Caveat+Brush');

body{ 
  font-family: "Droid Sans", sans-serif; //'projects'
}
#title {
  font-family: 'Caveat Brush', cursive; //'Junior Web Developer'
}

I am using gulp and browser-sync, but opening the html file directly from the browser has the same problem

Upvotes: 2

Views: 3036

Answers (1)

wpalmes
wpalmes

Reputation: 346

Move the @import code to the very top of your CSS file above everything else.

@import url('https://fonts.googleapis.com/css?family=Droid+Sans|Caveat+Brush');

Upvotes: 1

Related Questions