2017-10-12 6 views
0

J'utilise la police Google Open Sans (https://fonts.google.com/specimen/Open+Sans) avec cyrillic. Et si j'ai souligné le mot (- le symbole de l'accent est manquant dans la police), Google Chrome rend seulement la partie après l'accent. Mais un autre navigateur n'a pas le même problème.Google fonts - rendu partiel dans Google Chrome

comparaison de rendu: Comparative Google and Edge rendering Je comprends que chaque navigateur a rendu propre moteur, mais je veux bien résoudre ou éviter ce problème. Que devrais-je faire?

.open-sans-font { 
 
    font-family: "Open Sans"; 
 
}
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&amp;subset=cyrillic" rel="stylesheet"> 
 
<div class="open-sans-font"> 
 
\t <p> філігра́нний — несамови́тий </p> 
 
\t <p> філігранний — несамовитий </p> 
 
</div>

+0

Je ne comprends pas, les deux captures d'écran montrent ce qui ressemble à la même chose, sauf pour la première ф dans Chrome. Pouvez-vous préciser davantage ce que vous avez besoin de nous remarquer? –

Répondre

0

J'ai simplement ajouté « text = ... чшщьюя » à ma demande API Google Web Fonts.

<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&text=АБВГҐДЕЄЖЗИІЇЙКЛМНОПРСТУФХЦЧШЩЬЮЯабвгґдеєжзиіїйклмнопрстуфхцчшщьюя́" rel="stylesheet"> 

Il se trouve que le symbole d'accent appartenait à latin-poste charset

0

Prendre comme vous voulez vous assurer que la largeur est la même pour cette ligne. J'ass une classe à cette <p> par exemple

<p class="RenderTrouble">філігра́нний — несамови́тий</p> 

Et dans votre css mis

.RenderTrouble { 
       max-width: 200px; /* Or how ever many pixels it is long */ 
} 

Et cela devrait le faire. le seul problème est de trouver combien de pixels le rendu est rendu. Je vais faire le calcul; 1398 -19 = 1379 La longueur de la phrase est 1379px donc faire le css

.RenderTrouble { 
       max-width: 1379px; /* Or how ever many pixels it is long */ 
} 

Eh bien, en théorie, de toute façon. ça ne marche pas pour moi alors j'ai peur que tu n'aies pas de chance. Je vais continuer à essayer de voir si je peux obtenir
je renoncer à here

<img src="./Untitled.png" style="max-width: 210px; height: 120;"> 
+0

@PsyhoWolf, c'est une bonne idée. Mais, malheureusement, créer une image sur chaque phrase est trop coûteux. – Palindromer