5

I want to use the google Roboto font, but it looks like very ugly in IE11 / Edge. Here is my example code:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link href='http://fonts.googleapis.com/css?family=Roboto:300' rel='stylesheet' type='text/css'>
    <title></title>
</head>
<body>
<div style="font-family: 'Roboto'">
    közötti műveleteire.
</div>

The upper text shows in IE/Edge, the lower is the Chrome version. (The letter ű is very ugly) How can I use Roboto correctly in IE?

user1552545
  • 1,233
  • 3
  • 15
  • 33

1 Answers1

9

Try using this instead and see if it works:

<link href='http://fonts.googleapis.com/css?family=Roboto&subset=latin,greek,greek-ext,latin-ext,cyrillic' rel='stylesheet' type='text/css'>
Mohamed Islam
  • 712
  • 6
  • 11
  • Could you explain what in this helps IE? – Chic Mar 20 '18 at 16:36
  • Just tried this and seems that IE must have "latin" subset first, other browsers do not care about particular order. /* latin */ @font-face { font-family: 'Roboto'; /* ... */ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } – Miha Pirnat Apr 09 '19 at 13:46
  • amazing it seems it really helped to IE in my case (&subset=latin,latin-ext) – luky May 12 '20 at 11:29