28172 sujets

CSS et mise en forme, CSS3

Bug sur un article alsa ?

Bonjour,

Je suis en train de lire l'article suivant : http://www.alsacreations.com/article/lire/563-gerer-la-taille-du-texte-avec-les-em.html

J'ai voulu essayer le code de l'exemple "À quoi correspond un « em » dans une ligne de texte ?", mais je n'obtiens pas le même résultat que dans l'article (testé sous Firefox, Safari, Opera).

Voici le code que j'utilise (qui normalement est identique) :



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
 
	<title>Test</title>
	
	<style type='text/css'>
	
		p {
			float		: left;
			background	: skyblue;
			font-size	: 1em;
		}
		
		.verdana {
			font-family	: Verdana;
		}
		
		.nimbus {
			font-family	: "Nimbus Roman No9 L";
		}
		
		.temoin {
			background	: red;
			height		: 1em;
			width		: .25em;
		}
	
	</style>
	
</head>

<body>

	<p class="verdana">Ày</p>
	
	<p class="nimbus">Ày</p>
	
	<div class="temoin"></div>

</body>	
</html>


Et voici ce que j'obtiens en résultat :

http://img18.imageshack.us/img18/766/image1b.png

Est-ce normal ?
Modifié par iDev (01 Mar 2009 - 15:17)
Salut,

iDev a écrit :
J'ai voulu essayer le code de l'exemple "À quoi correspond un « em » dans une ligne de texte ?", mais je n'obtiens pas le même résultat que dans l'article (testé sous Firefox, Safari, Opera).
Je ne suis pas sûr de bien comprendre ce que tu veux dire : si tu veux parler du fait que les carrés bleus n'ont pas la même hauteur c'est expliqué juste après dans le chapitre "Est-ce que la taille d'un « em » varie en fonction de la police?"

Comme je ne dispose pas de la police "Nimbus Roman No9 L" sur mon poste elle est remplacée par "Times New Roman" (valeur par défaut dans mon navigateur) et je ne saurais dire si la hauteur serait alors la même mais encore une fois la question n'est pas là. Smiley cligne
Non, je parle du fait que le <div> rouge "témoin" soit au-dessus des deux <p> sur mon image alors qu'il devrait être entre les 2.
Florent a écrit :
On réalise une capture d'écran de cet exemple, on aligne les éléments et on trace quelques traits pour mettre en évidence les correspondances de hauteurs, et voilà ce qu'on obtient :
Au temps pour moi, c'est donc normal.

Merci et désolé pour le dérangement Smiley cligne
Modifié par iDev (01 Mar 2009 - 19:15)
Sujet clos
Aller à