28172 sujets

CSS et mise en forme, CSS3

Une nouvelle différence d'affichage Firefox, IE7.

Bonjour,

En gros, mon problème est classique pour de nombreuses personnes je suppose mais je me demande si il n'y a pas un moyen de standardiser l'affichage sous firefox et sous IE7.

Par exemple, voici mon menu (très simpliste) :
http://img511.imageshack.us/img511/8761/ie7vsfirefoxst8.jpg

- La police sous IE7 à l'air en gras alors que sur Firefox non.
- IE voit plus grand que Firefox
- Et au niveau des bordures 'dashed', sous firefox, il y a un léger retrait sur la bordure du dessous.

Des problèmes qui ne m'empêcheront pas de continuer mais je voudrais tout de même savoir si il existe une solution pour standardiser au max.

Voici mon code css :

recherche.css


ul#menu {
	list-style-type: none;
	margin: 0;
	padding: 5px;
}

ul#menu a{
	text-decoration: none;
	color: black;
}
		
ul#menu a:hover {
	text-decoration: underline;
	color: blue;
}


style.css (là où je regroupe tous les styles pour les éléments du site

.recherche1 {
	border-top: thin dashed;
	border-bottom: thin dashed;
	text-align:center;
	font-size:small;
	margin-bottom:2px;
}

.recherche2 {
	margin-top:-4px;
	text-align:center;
	font-size:xx-small;
}

.centre {
	text-align:center;
}

.menu1 {
	border-top: thin dashed;
	border-bottom: thin dashed;
	text-align:center;
	font-size:small;
	margin-top:10px;
	margin-bottom:2px;
}

.menu2 {
	text-align:left;
	font-size:small;
	margin-left:10px;
}




recherche.html

<!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>Recherche CSS</title>
<link href="Design/recherche.css" rel="stylesheet" type="text/css" />
<link href="Design/style.css" rel="stylesheet" type="text/css" />
</head>

<body>

  <ul id="menu">
    <li class="recherche1">Recherche</li>
	<li class="centre"><input type="text" name="recherche" id="recherche" size="15"/></li>
	<li class="centre"><input type="submit" name="valider" value="Rechercher"/></li>
	<li class="recherche2"><a href="index.php?action=recherche_avancee">Recherche avancée</a></li>
  </ul>


</body>
</html>


Je me cherche encore niveau organisation du site, si jamais vous avez des astuces aussi.
Modifié par BassT4ken (17 Feb 2009 - 15:26)
a écrit :
- La police sous IE7 à l'air en gras alors que sur Firefox non.

Non, ce n'est pas gras, c'est juste la façon dont sont lisé les caractères qui changent (et que l'utilisateur peut configurer). Fais une recherche sur "ClearType" pour plus d'info

a écrit :
- IE voit plus grand que Firefox

Il me semble, mais ce n'est pas ma spécialité, que IE et FF, ne calculent pas les tailles en em de la même façon. Cela peut aussi être une cause du lissage.
Bonjour,

BassT4ken a écrit :
je me demande si il n'y a pas un moyen de standardiser l'affichage

Non.
Laurie-Anne a écrit :
- La police sous IE7 à l'air en gras alors que sur Firefox non.

Non, ce n'est pas gras, c'est juste la façon dont sont lisé les caractères qui changent (et que l'utilisateur peut configurer). Fais une recherche sur "ClearType" pour plus d'info

a écrit :
- IE voit plus grand que Firefox

Il me semble, mais ce n'est pas ma spécialité, que IE et FF, ne calculent pas les tailles en em de la même façon. Cela peut aussi être une cause du lissage.

Merci beaucoup. Clic droit sur le bureau > propriétés > onglet apparence > bouton effets et sélectionner ClearType au lieu de Normal.

La police dans firefox ressemble maintenant à celle d'IE, c'était donc un problème de lissage de la police sur firefox.

Il y a toujours le petit problème de bordure et du fait qu'IE voit plus grand mais le design est déjà plus standardisé qu'avant, merci Smiley cligne
BassT4ken a écrit :
La police dans firefox ressemble maintenant à celle d'IE, c'était donc un problème de lissage de la police sur firefox.

En fait c'est plutôt un problème d'IE7, qui force l'utilisation de ClearType sans prendre en compte la configuration du système. Enfin, seulement si on considère que c'est une erreur. Pour ma part j'estime que c'est un parti-pris qui peut se défendre. Smiley cligne

BassT4ken a écrit :
mais le design est déjà plus standardisé qu'avant, merci Smiley cligne

Non, le design n'a pas changé d'un iota, c'est juste la configuration de ta machine qui a changé.

Je te conseille en passant de tester le rendu avec Opera et Safari (tous deux disponibles pour Windows). Tu verras, c'est édifiant. Smiley smile
Modifié par Florent V. (18 Feb 2009 - 19:31)
Sujet clos
Aller à