font-variant: small-caps; font-size: 12px; Firefox: Capital letters: 12px Lowercase letters: 10px Chrome: Capital letters: 12px Lowercase letters: 8px How to harmonize that without using JavaScript?
3 Réponses :
Vous pouvez cibler les navigateurs individuellement en utilisant des hacks CSS comme ceci: Une manière plus agréable Cependant, à mon avis implique un minuscule bit de JavaScript qui détecte le navigateur et définit une classe sur le Elément HTML, puis vous pouvez utiliser cette classe comme base pour cibler les navigateurs individuels. P> à la fin, il ressemblerait à ceci: P> <html class="firefox">
...
</html>
.firefox .rulename {
//firefox specific css here
}
Merci, mais le problème est de trouver le meilleur moyen de réparer la taille de la police, et non de la détection du navigateur :)
C'est la meilleure façon, car il n'y a pas d'autre moyen :)
Je parle du rendu de la Font-Variant (la proportionnalité de la taille des lettres minuscules par rapport aux lettres majuscules), pas de la taille de la police. Devrais-je simplement arrêter d'utiliser Font-Variant et ajouter un pour chaque lettre majuscule?
Eh bien, cela ne semble pas comme une bonne solution, mais alors les polices sont rendues différemment dans tous les navigateurs et ont toujours. Les utilisateurs y sont habitués et tbh, puisque la plupart des utilisateurs ne visitent jamais un site dans plus d'un navigateur, personne ne remarque ... Si j'étais, vous l'ignorez ... désolé de ne pas pouvoir être utile.
@SimonsteInberger: En réalité, ce n'est pas le cas, cela prend toutefois une vision différente à ce sujet que l'OP n'a que la raison étant qu'il n'y avait pas de solution pour ce que l'OP voulait. Et BTW n'est toujours pas aujourd'hui, 4 ans après que la question a été faite, et il n'y aura pas à l'avenir, car, comme j'essaye d'expliquer, cela n'est pas pertinent pour l'utilisateur final et donc aux personnes qui développent la navigateurs.
J'ai un problème similaire avec une question beaucoup plus étrange entre Safari sur iPad VS Safari sur des ordinateurs de bureau, affichant une échelle différente pour les petites capitalisations à 16 px. Pour une raison quelconque, les petites capuchons sont une taille plus grande sur des iPads, ce qui correspond à celui de Firefox.
Réglage de la taille de la police ou de l'espacement de la lettre d'un demi-pixel de moins, peut atténuer le problème sans autre hack supplémentaire. En trouvant essentiellement un ajustement intermédiaire minuscule qui déclenche sur un navigateur, mais pas sur un autre, d'essayer d'obtenir aussi près que possible.
Ce que j'ai observé pour Firefox et c'est-à-dire, c'est que les polices ont tendance à faire échelle avec de nombreuses tailles intermédiaires que celle de WebKit. Par exemple, dans IE et Firefox, 15,6px est un peu plus gros et utilisez plus de suivi pour ajuster, que celui de 15.5px, de 15,7px, 15,8px, 15,8px, avec une différence pour presque tous les 0,1 pixels. Alors que dans sa safari, la différence n'est perçue que pour chaque 0.4px ou plus.
Pour ma petite case ici, qui a créé un problème de débordement, j'ai utilisé 15.5px, qui est à peine différent de 16px sur safari (bureau), tout en faisant tomber la taille des petites capuchons pour IE et Firefox aussi près que possible de Safari's.
Les navigateurs WebKit affichent les petites capuchons plus petites que les autres navigateurs .. Vous pouvez utiliser des requêtes de média CSS pour renifler facilement les navigateurs WebKit tels que Chrome et Safari. Essayez quelque chose comme ceci:
Une solution consiste à utiliser une famille de polices qui fournit une variante de petites capitalisations. À moins que vous n'utilisiez une telle police, vous êtes coincé avec une idée de la propre idée de la propre notion de ce que les petites capitalisations devraient signifier, car il met à la redimension des capuchons elle-même.
En outre, une fois que vous avez eu à l'aide de fausses capuchons, ne mettez pas une surface "pleine taille" autour des bouchons, placez une "petite taille" autour des lettres minuscules. Les espaces blanche, la ponctuation et d'autres symboles doivent rester à pleine taille.
On dirait que ce problème devient plus profond, j'ai récemment déplacé mon site sur un autre serveur et chrome affiche les lettres minuscules de différentes tailles en fonction du serveur qui servant les fichiers. L'une est Windows 7 avec XAMPP, l'autre est Ubuntu avec une architecture de lampe. Windows Server affiche les lettres minuscules 1px plus grandes que la version Linux.