Bug in sub heading of http://blog.savetheinternet.in

[raghavio]

This is weird. Here's the header code from http://blog.savetheinternet.in

<div class="main-header-content inner">
    <h1 class="page-title">Save the Internet</h1>
    <h2 class="page-description">India’s fight for Net Neutrality</h2>
</div>

And this is how it renders No F in fight.

The problem is in font-weight property of page-description.

I'm using OSX 10.11.1 and this happens on latest versions of Safari, Firefox and Chrome.

[captn3m0]

Same for me on OSX 10.11.1 + Chrome atleast. Guessing an issue with the Merriweather?

[captn3m0]

Looks like its a bug in the fi ligature in the Merriweather font update: https://github.com/google/fonts/issues/8#issuecomment-174155822

[davelab6]

The update to Merriweather was made in advance of the Firefox 44 launch on Tuesday that will mean the old files will just stop working.

The bug with fi/fl ligatures has a workaround - you can turn ligatures off with CSS to work around this until then:

-webkit-font-feature-settings: 'liga' 0, 'onum' 1, 'kern' 1;
-moz-font-feature-settings: 'liga' 0, 'onum' 1, 'kern' 1;
-o-font-feature-settings: 'liga' 0, 'onum' 1, 'kern' 1;
font-feature-settings: 'liga' 0, 'onum' 1, 'kern' 1;

[miteshashar]

@davelab6 I checked that this does get solved if we change font-weight: 400; to font-weight: bold;. This may not be the ideal solution but works, is trivial and lets us focus on more important things right now. Anyways, feel free to fork & send us a PR on what you feel is the best solution. Though, this bug is technically not a part of this repo. It should be on https://github.com/netneutrality/blog.savetheinternet.in

[davelab6]

If you do nothing, it will be fixed upstream with Google in about 24 hours

[miteshashar]

@davelab6 Ah, perfect! Thanks for the heads up.