CODEWITHSUNDEEP
htmlcssgoogle-chromeinternet-explorerfirefox
TeslaK20
TeslaK20

Reputation: 223

Font works in IE, but but not Firefox or Chrome

I am having problem with fonts displaying in a website I am making. I am using the font ErasITC Light. The relevant HTML is:

<div class="heading">
<div class="container-fluid">
    <h1>make your voice heard</h1>
    <h2>it's time to let the people speak out</h2>
</div>

The relevant CSS is:

.heading h1{
font-family: ErasITC, Eras Light ITC, sans-serif;
color: #ffffff;
font-size: 6.25vw;
font-weight: 300;
text-shadow: 2px 2px 15px black;
text-align:center;
margin-top: 21vh;

}

.heading h2{
    font-family: ErasITC, Eras Light ITC, sans-serif;
    color: #ffffff;
    font-size: 2.7vw;
    font-weight: 300;
    text-shadow: 2px 2px 10px black;
    text-align:center;
}

This works in IE, but not in Chrome or Firefox, where it displays a default Sans-Serif font.

NOTE: I am using bootstrap for some elements.

Thanks,

Geffen Avraham.

Upvotes: 0

Views: 1245

Answers (1)

Aquiblo
Aquiblo

Reputation: 121

When you are using white-spaces for font names you have to put them in quotes, like so:

font-family: "Eras ITC", "Eras Light ITC", Sans-Serif;

Upvotes: 3

Related Questions