Differences IE, FF

Fermé
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 - 15 avril 2009 à 10:42
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 15 avril 2009 à 16:08
Bonjour,

j'ai des differences entre IE et firefox ( normal ^^)
mais cette fois ci c'est firefox qui pose problème...
j'ai des espaces entre des tr... j'ai résolu le problème mais c'est ss IE que ça ne va plus

alors je voudrai savoir si je pouvais rajouter un style de la sorte:

<!--[if IE]>
<STYLE type="txt/css">
<!--

mon code css

-->
</STYLE>
<![endif]-->

pour éviter d'avoir deux feuilles de styles differentes.

Merci d'avance

21 réponses

Bonjour à tous,
ma méthode qui m'a souvent sauvé lors de modifications ultérieures (quand vous devez vous replonger dans le code):

j'insère dans la zone "head" de ma page (dans un include "in-head" pour toutes les pages) le lien vers ma feuille de style générale (habillage) correspondant à la mise en page Firefox par défaut (respect W3C) puis pour les différences de présentations IE, j'ai des feuille de style pour IE général, IE6, 7 et 8 en particulier avec seules les modifications nécessaires et surtout pas de : !important dans la page

Exemple d'appel dans le head, feuille de style dans dossier /css/:

//Appel Feuille css générale
<link rel="stylesheet" href="css/habillage.css" type="text/css" media="projection, screen, tv" />

//Appel Feuille css pour IE
<!--[if IE ]>
   <link rel="stylesheet" href="css/habillage_ie.css" type="text/css" media="projection, screen, tv" />
<![endif]-->

//Appel Feuille css IE6
<!--[if lte IE 6]>
   <link rel="stylesheet" href="css/habillage_ie6.css" type="text/css" media="projection, screen, tv" />
<![endif]-->

//Appel Feuille css IE7
<!--[if IE 7]>
   <link rel="stylesheet" href="css/habillage_ie7.css" type="text/css" media="projection, screen, tv" />
<![endif]-->

//Appel Feuille css IE8
<!--[if IE 8]>
   <link rel="stylesheet" href="css/habillage_ie8.css" type="text/css" media="projection, screen, tv" />
<![endif]-->



J'utilise par défaut firefox et pour les adaptations IE, je visualise avec IETester (logiciel perméttant d'avoir tous les IE, dont le dernier BETA IE 8 et je modifie à la demande, ce qui me libère le code.

Pensez au futur quand vous devrez modifier 2, 3 trucs dans le code!!!

Bon code
1
Sandriine Messages postés 1255 Date d'inscription samedi 9 décembre 2006 Statut Membre Dernière intervention 18 août 2010 283
15 avril 2009 à 11:06
As-tu testé?

Cordialement,
Sandrine
0
bg62 Messages postés 23663 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 8 décembre 2024 2 391
15 avril 2009 à 11:08
bravo pour la réponse .... !
0
Sandriine Messages postés 1255 Date d'inscription samedi 9 décembre 2006 Statut Membre Dernière intervention 18 août 2010 283 > bg62 Messages postés 23663 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 8 décembre 2024
15 avril 2009 à 11:09
Ok c'est bien de critiquer les autres, sauf qu'il poste son code sans dire que ça lui pose problème, mais pour demander si il marche. Alors autant tester avant.
Au lieu de critiquer tu pourrai donner la solution....

Merci pour lui
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:07
oui sauf que c'est pas comme ça
<!--[if lte IE ]>
Ici code pour IE (6 et inférieur, à adapter pour toi)
<![endif]-->

il faut pas de de ----
sinon ça devient un commentaire
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
15 avril 2009 à 16:03
salut,

il faut pas de de ----
sinon ça devient un commentaire

mais d'après toi pourquoi on appelle ça des commentaires conditionnels ?
-:oD

+ http://www.blog-and-blues.org/articles/Les_syntaxes_de_commentaires_conditionnels_pour_IE_Windows
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:10
tu répond à qui ?
au fait c'est pas du tout pratique le nouvelle affichage avec les réponse qui sont même pas dans l'ordre
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:11
oui, ça m'affiche une page banche si je mets du code css...

j'ai trouvé l'attribut !important pour changer le css de firefox,
exemple:

img{

margin-bottom:0px;
margin-bottom:-5px!important;
}

là, sous ff l'image sera décalé de 5px et pas sous IE.

Mais ça marche sous IE6, sous IE8 mais pas sous IE7!!

Si quelqu'un avait une idée.
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:12
tu as essayé avec if ie7
chez moi lf ie7 marche pour ie6 aussi
0
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:19
alors,

je viens d'essayer:

<!--[if lte IE7 ]>
<STYLE type="txt/css">

body img{

margin-bottom:0px;

}

</STYLE>
<![endif]-->


mais ça m'affiche une page blanche...
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:27
passe la page normalement il y a moyen de rendre les position pareil sur tous les navi
0
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:30
et bien en fait c'est des images dans un tableau,
sous firefox j'ai des espaces sous ces images.

si je fais un margin:-5px; elles se remettent bien mais sous IE elles sont décalées dans l'autre sens...
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:32
tu sais que les tableau ne sont pas conseillé pour la mise en page tu essayé normalement avec des div
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:33
il est qu'en bêta ,non ?
0
bg62 Messages postés 23663 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 8 décembre 2024 2 391
15 avril 2009 à 12:01
non ! il est en circuit depuis pas mal de temps !!! et les mises à jour automatiques l'installent ....
0
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:34
et bien sous IE8 cela marche:

img{

margin-bottom:0px;
margin-bottom:-5px!important;
}

mais pas sous IE7....
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:37
attent tu dis que c'est decalé dans l'autre sens mais tu as essayé alors l'inverse magin-top
au fait le !important ne marche que sous firefox je crois
0
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:40
oui justement, !important ne marche que sous firefox.

je récapitule:

_j'ai un tableau avec des images.
sous IE pas de problème. Sous firefox j'ai un décalage sous mes images de 5px

_je fais:
img{
margin-bottom:0px;
margin-bottom:-5px!important;
}

là c'est bon sous firefox, mais sous IE7 mes images se décalent de 5px vers le bas, et comme avant ce décalage elles étaient bien positinnées, elles se retrouvent maintenant 5px trop bas...
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 11:41
tu peux passer le code entier de la page avec le css je vais de trouvé un truc pour adapter
0
InAme19 Messages postés 539 Date d'inscription samedi 13 septembre 2008 Statut Membre Dernière intervention 29 novembre 2012 62
15 avril 2009 à 11:52
voilà pour le tableau:

<table width="998" align="center" cellpadding="0" cellspacing="0" class='fond'>
<tr>
  <td width="998">
	  <table cellspacing="0" cellpadding="0" class='tab1'>
		  <tr>
			<td rowspan="2"><a href="">
			<img class="banniere" src="i09.jpg" alt="" width="284" height="246" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="10.jpg" name="Image13" width="103" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere"  src="02.jpg" name="Image14" width="95" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="03.jpg" name="Image15" width="98" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="04.jpg" name="Image16" width="94" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="05.jpg" name="Image17" width="99" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="06.jpg" name="Image18" width="94" height="145" border="0" /></a></td>
			<td><a href="">
			<img class="banniere" src="07.jpg" name="Image19" width="131" height="145" border="0" /></a></td>
		  </tr>
		  <tr>
			<td colspan="7"><img class="banniere" src="11.jpg" width="714" height="101" alt="" /></td>
			</tr>
		</table>
	</td>
  </tr>

	<tr>
		<td >
		<div id="page">
                </div>
                 </td>
       </tr>
</table>
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 12:00
chez moi c'est pareil


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
<!--
img{
margin-bottom:0px;
margin-bottom:-5px!important;
} -->
</style>
</head>
<body>
<table class="fond" align="center" cellpadding="0"
cellspacing="0" width="998">
<tbody>
<tr>
<td width="998">
<table class="tab1" cellpadding="0"
cellspacing="0">
<tbody>
<tr>
<td rowspan="2"><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" alt=""
border="0" height="246" width="284"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image13"
border="0" height="145" width="103"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image14"
border="0" height="145" width="95"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image15"
border="0" height="145" width="98"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image16"
border="0" height="145" width="94"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image17"
border="0" height="145" width="99"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image18"
border="0" height="145" width="94"></a></td>
<td><a href="">
<img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" name="Image19"
border="0" height="145" width="131"></a></td>
</tr>
<tr>
<td colspan="7"><img class="banniere"
src="http://bormat2.free.fr/chiot%201.jpg" alt=""
height="101" width="714"></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>
<div id="page"></div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 12:35
interessant ie tester je vais le télécharger pour voir moi j'utlisais multiple ie mais ton logiciel a 'air plus pratique
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
15 avril 2009 à 12:44
ha ba super du coup je me suis rendu compte que mon menu déroulant n'était pas compatible avec ie8 alors qu'il marcher sous ie6 ie7 et firefox opéra et les autres

edit avec la mise à jour ça remarche mais différence d'affichage bizarre
0
bg62 Messages postés 23663 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 8 décembre 2024 2 391
15 avril 2009 à 15:43
bien vu !!! et moi je suis en train de tout refaire à cause de ça !!!!
près de 10 000 pages dans un site !!!
merci bibillll
0
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
15 avril 2009 à 16:08
salut,

je récapitule:
_j'ai un tableau avec des images.
sous IE pas de problème. Sous firefox j'ai un décalage sous mes images de 5px

avant de jouer les apprentis sorciers, avez-vous essayé :
table{
border-collapse:collapse;
}

ou de fixer la taille des <tr> et/ou <td> ?
0