Incorrect rendering/display of Devanagari fonts in browsers: Chrome, Firefox etc

When I typed the title I was directed to another question "Hindi display of words such as "pra" "gra"". My experience is somewhat different than discussed there. The display is correct in LibreOffice and Text Editor but not in browser search results page. Again if you click the link with incorrect display the actual website displays correctly. I experimented with copying the incorrectly displayed lines and pasted in text editor and it displayed correctly.

This problem seems to be only in Debian/Ubuntu and distros based on them. I have tried a few other distros like Fedora, Manjaro and Solus and everything is displayed correctly in them.

This is an issue with the default fonts used by the browsers

See How do I enable writing in Indian languages? if you have not enabled Indian language yet. This answer is for problems specific to Indian language font rendering in the browser.

For some reason Indian fonts are not rendered correctly in the browsers in Ubuntu. Changing the default fonts used by the browsers solves it. The instructions below are for Chrome. The same can be done for Firefox.

Steps:

First: Open the Chrome settings and scroll down to Appearance.

Second: Click on Customize fonts

Third: Change the Standard Font to a font that fully supports Indian languages. Here I have chosen Lohit Devanagari but you can choose another one.

The proof of the pudding...

is in eating!

Hope this helps