Compatibilité IE/FF
Résolu
LutiX
-
Ssylvainsab Messages postés 2892 Statut Modérateur -
Ssylvainsab Messages postés 2892 Statut Modérateur -
Bonjour à tous,
Je viens sur ce forum car je peine depuis plusieurs jours sur un problème de compatibilité entre les naviguateurs IE et FF j'ai trouvé où est à peut près le problème. Il vient du positionnement de mon menu à gauche à l'aide du float:left; mais cela engendre un problème sous IE il donne une marge à droite du menu de 1px.
Pour mieux vous montrez voilà une page de test très simple:
http://www.lutix.ch/test/test.html
Voici mon code Xhtml
et voici mon code css
j'espère que vous pourrez m'aidez
merci d'avance...
LutiX
Je viens sur ce forum car je peine depuis plusieurs jours sur un problème de compatibilité entre les naviguateurs IE et FF j'ai trouvé où est à peut près le problème. Il vient du positionnement de mon menu à gauche à l'aide du float:left; mais cela engendre un problème sous IE il donne une marge à droite du menu de 1px.
Pour mieux vous montrez voilà une page de test très simple:
http://www.lutix.ch/test/test.html
Voici mon code Xhtml
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>--</title> <link href="test.css" rel="stylesheet" type="text/css" /> <style type="text/css"> </style> </head> <body> <div id="conteneur"> <div id="bleu"> </div> <div id="rouge"> </div> </div> </body> </html>
et voici mon code css
*{
margin:0;
padding:0;
border:0;
}
#conteneur{
margin:auto;
background-color:black;
width:800px;
height:800px;
}
#bleu{
float:left;
width:100px;
height:100px;
background-color:blue;
}
#rouge{
width:200px;
height:200px;
background-color:red;
margin:0 0 0 100px;
}
j'espère que vous pourrez m'aidez
merci d'avance...
LutiX
5 réponses
-
Bonsoir.
J'ai réglé le problème en appliquant un style si le navigateur est IE via les instructions conditionnelles.
Voir :
http://sylvain.sab.free.fr/autres/ccmsdz/decalage_bloc_ie/test.html
Il suffit de definir une marge a droite de -1px au bloc bleu.
Regardes le code, tu comprendras ;-)
a plus -
Oui merci mais j'avais pensé à cette solution mais je la trouve pas très propre! il doit bien y avoir une solution de mettre deux bloc cote à cote plus proprement non?
-
Moi je la trouve propre cette solution.
Et simple en plus.
Mais c'est vrai que ca serait mieux avec des CSS externes.
A mon avis le mieux c'est de faire trois CSS :
un pour tous les navigateurs
un pour tous sauf Ie
un pour IE
C'est ce que je fais sur mon site.
a plus -
Oué tu as surement raison... c'est surement la solution qui pose le moins de problèmes merci du conseil
-
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question -
Et puis comme ca, c'est très pratique pour gérer tes fichiers CSS.
Tu sais tout de suite lequel modifier si tu as besoin d'afficher différemment sous tous les navigateurs sauf IE, seulement Ie ou tous les navigateurs.
Et puis, dès que tu as un problème, tu regardes avec IE, puis avec un autre navigateur :
Si tu as le problème avec les deux, il faut modifier le CSS "principal".
Sinon, c'est la feuille qui correspond a IE/autre navigateur
a plus
