[Résolu] Probléme de compatibilité entre Firefox et Internet Explorer

[kimzey]

Bonjour,

Commençant tout juste à regarder le mode de fonctionnement des css et du HTML je me retrouve déjà devant un problème. J'imagine déjà les moqueries mais à la suite d'une après midi de recherche et d'essais infructueux :pt1cable: vous êtes ma seule chance.

En effet j'essaie de modifier un module prestashop et son CSS afin d'obtenir ce résultat:

http://uppix.net/5/c/8/99d09083b73a2db64abb992c7c7d9.html

malheureusement sous firefox tout ce passe "bien" mais sur IE:

IE8:

http://uppix.net/f/b/9/6ca04448df19da655e77258e6a3da.html

et le meilleur pour la fin IE6:

http://uppix.net/f/b/0/6150b467e14099703945a0b93b130.html


Je ne sais plus quoi faire j'aimerai savoir si vous auriez une piste ou même un conseils pour améliorer le code ?

Merci par avance pour votre aide. :jap:

[pacosxm]

Tes .jpeg sont trop petit, on ne vois rien...

[kimzey]

Ah oui effectivement je viens d'éditer

[eltitos]

Generalement Firefox safari chrome opera et IE8 sont identiques, apres ie6 et ie7 c'est la cata.


Deux solutions soit utilise des hacks (recherche hack ie6 css dans un moteur de recherche) dans le fichier global.css

Ou sinon est de creer un fichier css pour ie6, 1 pour ie7 et utilise le global.css pour le reste.
Dupliquer deux fois le global.css puis les renommer

A rajouter dans le header.tpl, si c'est pour un module ayant son propre css, il suffit d'appeler le css du module ( et pas tout le global.css)

<!--[if !IE]><!--><link rel="stylesheet" media="all" type="text/css" href="{$css_dir}global.css" /><!--<!--[if gte IE 8]>
    <link rel="stylesheet" type="text/css" href="{$css_dir}global.css" />

<!--[if IE 7]> <link href="{$css_dir}ie7.css" rel="stylesheet" type="text/css" media="{$media}" />     
<!--[if IE 6]> <link href="{$css_dir}ie6.css" rel="stylesheet" type="text/css" media="{$media}" /> 

Il vaux mieux faire cette manipulation a la fin (quand le design est fini) car si tu fais une modification sur le global.css il faudra la copier sur les autres css.

PS: ie6 et ie7 n'aime pas trop le padding

[kimzey]

Merci pour ton conseil mais en fouinant encore j'ai fini par avoir un résultat conforme à mes attentes sur FF, Chrome,Safari et tous les IE depuis le 6 !!!

[pacosxm]

Merci pour ton conseil mais en fouinant encore j'ai fini par avoir un résultat conforme à mes attentes sur FF, Chrome,Safari et tous les IE depuis le 6 !!!

Tu peux nous expliquer ?
J'ai aussi des soucis d'affichage avec Internet Explorer.
Merci.

[kimzey]

Il manquait une Div pour encadrer mon code et après il a suffit de faire des ajustements avec les margins. Dans mon CSS j'ai rajouté aussi pour un lien

cursor: pointer;

car le lien n'était pas vu par IE6.