Menu
I'm working on a blog design and the main font is Roboto, it's from Google fonts site.
The problem is that it's doesn't rendered correctly in Firefox, instead of using Roboto font, Firefox use Tahoma.
@font-face
{
font-family: Roboto-Regular;
}
@font-face
{
font-family: Roboto-Bold;
}
It works well in Chrome and Safari.
Thanks,
774
To use Roboto in regular and bold versions, use this to include the style sheet in the page:
<link href='http://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
Then you use the font family name Roboto and set the weight using the font-weight style.
You can set them like this, and always use a fallback font:
font-family: Roboto, sans-serif;
font-weight: normal;
font-family: Roboto, sans-serif;
font-weight: bold;
Instead of the font weight names normal and bold you can also use the specific weight numbers 400 and 700, respectively.
100
I created a quick page which shows 3 fonts, Roboto, Tahoma and the default:
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
</head>
<body>
<p class="roboto">The quick brown fox jumps over the lazy dog</p>
<p class="tahoma">The quick brown fox jumps over the lazy dog</p>
<p>The quick brown fox jumps over the lazy dog</p>
</body>
</html>
http://codepen.io/anon/pen/bptvC
On firefox it shows Roboto.
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
