28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous!

J'ai sur une page une div à l'intérieur de laquelle s'affiche un titre en balises H1,mais, problème!
En effet, si ledit titre s'affiche normalement sous Firefox, sous Internet explorer il change de taille et ne peut donc rentrer dans son cadre...

voici la feuille de style de la Div:

#titra {
	background-image: url(Images/article_03.jpg);
	height: 37px;
	width: 519px;
	background-position:left top;
	background-repeat:no-repeat;
	top: 199px;
	left: 190px;
	float: right;
	font-family: "Trebuchet MS", sans-serif;
	font-weight: bold;
	letter-spacing: -2px;
	word-spacing: 0px;
	color: #FFFFFF;
	text-align: center;
	font-size: 0.8em;
	font-size-adjust:none;
 font-stretch:normal;
font-style:normal;
font-variant:normal;
}


div qui elle même est dans un conteneur que voici:

#haut {
	height: 262px;
	width: 709px;
	margin:0pt auto;
	position:relative;
margin-right:auto;
}


j'ai trituré ce code de diverses manières, rien n'y fait...Que faire?! Smiley rolleyes

Merci d'avance de votre aide,

vous pouvez voir par vous même içi:
http://ikamu.free.fr/lire.php?id=9

le titre normalement affiché étant
""Bonjour, euh...J'me présente, je m'appelle Henry...""






Smiley smile
Modifié par Nekashokoi (22 Aug 2008 - 21:36)
Bonjour,

Tu n'as jamais dit aux navigateurs quelle taille de texte tu voulais pour ton H1. Du coup, chaque navigateur applique la taille de texte par défaut pour les titres H1. Dans Firefox, par exemple, c'est un font-size: 2em. Dans Internet Explorer, de mémoire, les titres sont plus gros par défaut.

Pour spécifier quelle taille tu veux pour les H1:
h1 {font-size: ...;}

Et pour ne cibler que ce H1 là:
#titra h1 {font-size: ...;}


Voilà pour ce problème problème.
Mais, plus globalement, il faut apprendre à gérer le texte pour le Web, et prendre en compte toutes les contraintes du média. En gros, cela signifie que tu ne peux pas raisonnablement penser que ton texte tiendra dans un espace imparti (une boite de dimensions fixes, une seule ligne de texte pour un titre...) dans 100% des cas, et qu'il faut prévoir les cas où ça déborde, passe à la ligne, etc. L'idéal étant de gérer ça avec souplesse (hop, des designs extensibles en hauteur...), afin que ça soit presque transparent pour l'utilisateur, même si de ton point de vue le rendu n'est «pas bon» car pas exactement comme souhaité.

Sinon, tu as des erreurs HTML dans ton code (multiples balises <p> à la suite...).