Open Sans Condensed Light not working in Firefox

user_762243 0
Viewed 71691

I have downloaded the Open Sans Condensed Light font from Google Web Fonts, and also attached their CSS code:

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300&subset=greek-ext&v2'
      rel='stylesheet' type='text/css'>

But every browser other than Firefox, shows exact font family i.e. it looks fine in IE, Chrome, Safari, but not in Firefox.

Here is my CSS and the HTML code:

h2.title-border {
    border-bottom: 1px solid #000;
    margin-top: 10px;
    line-height: 45px;
    margin-bottom: 15px;
}

.heading-sub {
    background: #000;
    font-family: "Open Sans Condensed Light";
    font-weight: normal;
    text-transform: none;
    font-size: 32px;
    padding: 0 15px;
    margin-bottom: 0px;
    color: #fff;
    border-bottom: 1px solid #000;
}

HTML:

<h2 class="title-border"><span class="heading-sub">About Us</span></h2>

Can you please suggest, how should I fix Firefox regarding this?

google-font-api css html
10 Answers

Condensed is the "style" of the "Open Sans" font, not part of the name. This worked for me.

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:Condensed" />


.selector
{
    font-family:'Open Sans';
    font-style:condensed;
}
user_13117490
Related