turkish characters not in right font-family in safari html

Question

safari gives another font to the turkish characters: http://eraplus.eu/hakkimizda.html

while it on chrome looks perfect.

who can tell me how to show on safari like on chrome?

thanks

<html lang="tr">
<head>
    <title>Eraplus Europe | Move for future</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />

style.css

@charset 'UTF-8';
@import url("font-awesome.min.css");
@import url("http://fonts.googleapis.com/css?  family=Source+Sans+Pro:300,400,700,900,300italic");

body,input,textarea,select
{
    font-family: 'Source Sans Pro', arial, sans-serif;
    font-weight: 300;
    color: #5d5d5d;
}

The problem is in the use of fonts. Include sufficient code in the question itself to reproduce the issue. The solution will probably be simple, but the question and answer will not benefit future visitors without a clear statement of the problem. — Jukka K. Korpela, Feb 23 '15 at 19:25

score 2 · Accepted Answer · answered Mar 12 '15 at 11:51

2

Indeed, adding subset solved this issue!;

@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,900,300italic&subset=latin,latin-ext");

answered Mar 12 '15 at 11:51

Enzo

23
9

score 1 · Answer 2 · answered Feb 24 '15 at 07:01

The Source Sans Pro font contains by default only Latin 1 letters. To get all the letters needed in Turkish, such as ş and ğ, you need to append the string &subset=latin1,latin-ext to the URL that you use to take font into use, as mentioned on the font usage instructions by Google.

<style>
@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,900,300italic&");
body,input,textarea,select
{
    font-family: 'Source Sans Pro', arial, sans-serif;
    font-weight: 300;
}
</style>
Testing: işbirliği

turkish characters not in right font-family in safari html

2 Answers2