Explication du positionnement des différents polices ( ???)

Bonjour à tous,

Je viens de découvrir un truc dont j'ai vraiment du mal à comprendre sa logique...

Jusqu'à maintenant, j'ai codé un webdesign en utilisant la police "DoKChampa" et dans le doute qu'il soit pris en compte dans tous les configurations possible (cette police n'est pas intégrée dans tous les terminaux) j'ai donc décidé de mettre des polices en attente de remplacement.

html, body { font-family: DokChampa, "Trebuchet MS", Verdana, Arial; }

J'ai eu l'envie de vérifier le rendu et je m'étonne le fait que la position de texte dépend de la police utilisé (et encore je m'attendais pas qu'ils soient pas mal "déplacé").

Voici série d'image pour vous exposer mon étonnement :

En n'utilisant que DokChampa :

http://www.tryli.fr/forums/alsacreations/police_diff_position/dokchampa.png

Et n'utilisant que Trebuchet MS :

http://www.tryli.fr/forums/alsacreations/police_diff_position/trebuchetms.png

Comme vous pouvez voir, avec la police Trebuchet MS, la barre_navig prend de l'éloignement vers le haut. Pourquoi ? Et comment le résoudre ? (je suppose que je saurai le résoudre en comprenant le pourquoi du comment)

Voici le webdesign et son CSS si vous avez besoin

Merci

Salut,

le problème est que ces 2 polices sont très différentes et que tu as fixé une hauteur (height) à l'élément H1 au lieu de jouer sur le padding/margin. D'ailleurs d'une manière générale il ne faut pas fixer de hauteur aux conteneurs pour leur permettre de s'adapter au contenu.

En complément voir : Quelles polices de caractères (fontes) utiliser sur le Web.

Merci de ta réponse et du coup j'ai décidé de virer la police DokChaman parce qu'elle n'est pas présente dans la plupart configuration Windows et pas du tout chez Linux ni Mac...

En changeant la police, je me suis aperçu que cela génére quelques problèmes d'affichage, je suis obligé de regarder de nouveau le CSS afin de corriger quelques problèmes....



Merci encore et bonne soirée