décallage dans div entre Firefox et IE

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : décallage dans div entre Firefox et IE

par Pombela » 23 févr. 2009, 19:06

Merci pour les liens.

Apres recherche, j'ai supprimer mon padding-top et margin-left de ma div principale.

Maintenant ça à l'air de fonctionner sous les 2 navigateurs.

Merci de votre aide

par mere-teresa » 02 févr. 2009, 11:47

Re: décallage dans div entre Firefox et IE

par Victor BRITO » 02 févr. 2009, 09:53

Ci dessous le code de mon menu :

Code : Tout sélectionner

<div style="width:287px;height:613px;float:left;padding-top:10px;padding-left:30px;background:url(images/gauche1.png) top left no-repeat"> <div style="width:130px;height:55px;float:right;margin-right:10px"> <a href="index.php" target="_self"> <img src="images/btaccueil1.png" onmouseover="this.src='images/btaccueil.png'" onmouseout="this.src='images/btaccueil1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:50px"> <a href="asso.php" target="_self"> <img src="images/btasso1.png" onmouseover="this.src='images/btasso.png'" onmouseout="this.src='images/btasso1.png'"/></div> </a> <!-- debut sous menu deroulant BOUTON ASSOCIATION --> <div onmouseover="document.getElementById('smsg').style.display='block'" onmouseout="document.getElementById('smsg').style.display='none'" style="width:130px;height:auto;float:right;margin-top:1px;margin-right:80px"> <div> <img src="images/btsect1.png" onmouseover="this.src='images/btsect.png'" onmouseout="this.src='images/btsect1.png'"/> <div id="smsg" style="display:none;"> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="secmon.php" target="_self"> <img src="images/moniteurs1.png" onmouseover="this.src='images/moniteurs.png'" onmouseout="this.src='images/moniteurs1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/baby1.png" onmouseover="this.src='images/baby.png'" onmouseout="this.src='images/baby1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/pouss1.png" onmouseover="this.src='images/pouss.png'" onmouseout="this.src='images/pouss1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/pupilles1.png" onmouseover="this.src='images/pupilles.png'" onmouseout="this.src='images/pupilles1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/adultes1.png" onmouseover="this.src='images/adultes.png'" onmouseout="this.src='images/adultes1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/remf1.png" onmouseover="this.src='images/remf.png'" onmouseout="this.src='images/remf1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/btjuges1.png" onmouseover="this.src='images/btjuges.png'" onmouseout="this.src='images/btjuges1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/btcalend1.png" onmouseover="this.src='images/btcalend.png'" onmouseout="this.src='images/btcalend1.png'"/></div> <!-- fin sous menu deroulant BOUTON ASSOCIATION --> </div> </div> </div> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:110px"> <img src="images/btinscrip1.png" onmouseover="this.src='images/btinscrip.png'" onmouseout="this.src='images/btinscrip1.png'"/></div> <!--début sous menu déroulant BOUTON CALENDRIER--> <div onmouseover="document.getElementById('smca').style.display='block'" onmouseout="document.getElementById('smca').style.display='none'" style="width:130px;height:auto;float:right;margin-top:1px;margin-right:140px"> <div> <img src="images/btcalendrier1.png" onmouseover="this.src='images/btcalendrier.png'" onmouseout="this.src='images/btcalendrier1.png'"/> <div id="smca" style="display:none;"> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendad.php" target="_self"> <img src="images/adultes1.png" onmouseover="this.src='images/adultes.png'" onmouseout="this.src='images/adultes1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendpup.php" target="_self"> <img src="images/pupilles1.png" onmouseover="this.src='images/pupilles.png'" onmouseout="this.src='images/pupilles1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendpouss.php" target="_self"> <img src="images/pouss1.png" onmouseover="this.src='images/pouss.png'" onmouseout="this.src='images/pouss1.png'"/></div> </a> </div> </div> </div> <!--Fin sous menu déroulant BOUTON CALENDRIER--> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <img src="images/btcompet1.png" onmouseover="this.src='images/btcompet.png'" onmouseout="this.src='images/btcompet1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="essainotes.php" target="_self"> <img src="images/btresult1.png" onmouseover="this.src='images/btresult.png'" onmouseout="this.src='images/btresult1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="articles.php" target="_self"> <img src="images/btarticle1.png" onmouseover="this.src='images/btarticle.png'" onmouseout="this.src='images/btarticle1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="photos1.php" target="_self"> <img src="images/btphotos1.png" onmouseover="this.src='images/btphotos.png'" onmouseout="this.src='images/btphotos1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <img src="images/btcd1.png" onmouseover="this.src='images/btcd.png'" onmouseout="this.src='images/btcd1.png'"/></div> </div>
Ça ne coûte rien de créer des fichiers CSS et JavaScript : le code XHTML gagne en visibilité. ;)

par theblackbeast » 02 févr. 2009, 01:39

J'ai eu le même probléme que toi lorsque j'ai commencé mon site, j'ai était obligé de modifié mes données pour qu'elles soient a peu prés compatible et avec IE et avec Mozilla

par albat » 31 janv. 2009, 23:52

Modération :
Afin d'obtenir plus de réponses, le sujet est déplacé dans le forum "HTML, XHTML, CSS".

Merci de prendre le temps de lire les règlements
ainsi que l'intitulé de chaque forum avant de poster un nouveau sujet.

décallage dans div entre Firefox et IE

par Pombela » 31 janv. 2009, 21:11

Bonjour, je monte un site composé de la manière suivante :
1 entete provenant d'un fichier php
1 menu gauche provenant d'un fichier php
1 menu droite provenant d'un fichier php

Mon problème est le suivant : sous Firefox tout fonctionne nickel alors que sous IE j'ai un décallage dans mon menu

Ci dessous le code de mon menu :

Code : Tout sélectionner

<div style="width:287px;height:613px;float:left;padding-top:10px;padding-left:30px;background:url(images/gauche1.png) top left no-repeat"> <div style="width:130px;height:55px;float:right;margin-right:10px"> <a href="index.php" target="_self"> <img src="images/btaccueil1.png" onmouseover="this.src='images/btaccueil.png'" onmouseout="this.src='images/btaccueil1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:50px"> <a href="asso.php" target="_self"> <img src="images/btasso1.png" onmouseover="this.src='images/btasso.png'" onmouseout="this.src='images/btasso1.png'"/></div> </a> <!-- debut sous menu deroulant BOUTON ASSOCIATION --> <div onmouseover="document.getElementById('smsg').style.display='block'" onmouseout="document.getElementById('smsg').style.display='none'" style="width:130px;height:auto;float:right;margin-top:1px;margin-right:80px"> <div> <img src="images/btsect1.png" onmouseover="this.src='images/btsect.png'" onmouseout="this.src='images/btsect1.png'"/> <div id="smsg" style="display:none;"> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="secmon.php" target="_self"> <img src="images/moniteurs1.png" onmouseover="this.src='images/moniteurs.png'" onmouseout="this.src='images/moniteurs1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/baby1.png" onmouseover="this.src='images/baby.png'" onmouseout="this.src='images/baby1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/pouss1.png" onmouseover="this.src='images/pouss.png'" onmouseout="this.src='images/pouss1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/pupilles1.png" onmouseover="this.src='images/pupilles.png'" onmouseout="this.src='images/pupilles1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/adultes1.png" onmouseover="this.src='images/adultes.png'" onmouseout="this.src='images/adultes1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/remf1.png" onmouseover="this.src='images/remf.png'" onmouseout="this.src='images/remf1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/btjuges1.png" onmouseover="this.src='images/btjuges.png'" onmouseout="this.src='images/btjuges1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px"> <img src="images/btcalend1.png" onmouseover="this.src='images/btcalend.png'" onmouseout="this.src='images/btcalend1.png'"/></div> <!-- fin sous menu deroulant BOUTON ASSOCIATION --> </div> </div> </div> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:110px"> <img src="images/btinscrip1.png" onmouseover="this.src='images/btinscrip.png'" onmouseout="this.src='images/btinscrip1.png'"/></div> <!--début sous menu déroulant BOUTON CALENDRIER--> <div onmouseover="document.getElementById('smca').style.display='block'" onmouseout="document.getElementById('smca').style.display='none'" style="width:130px;height:auto;float:right;margin-top:1px;margin-right:140px"> <div> <img src="images/btcalendrier1.png" onmouseover="this.src='images/btcalendrier.png'" onmouseout="this.src='images/btcalendrier1.png'"/> <div id="smca" style="display:none;"> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendad.php" target="_self"> <img src="images/adultes1.png" onmouseover="this.src='images/adultes.png'" onmouseout="this.src='images/adultes1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendpup.php" target="_self"> <img src="images/pupilles1.png" onmouseover="this.src='images/pupilles.png'" onmouseout="this.src='images/pupilles1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px"> <a href="calendpouss.php" target="_self"> <img src="images/pouss1.png" onmouseover="this.src='images/pouss.png'" onmouseout="this.src='images/pouss1.png'"/></div> </a> </div> </div> </div> <!--Fin sous menu déroulant BOUTON CALENDRIER--> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <img src="images/btcompet1.png" onmouseover="this.src='images/btcompet.png'" onmouseout="this.src='images/btcompet1.png'"/></div> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="essainotes.php" target="_self"> <img src="images/btresult1.png" onmouseover="this.src='images/btresult.png'" onmouseout="this.src='images/btresult1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="articles.php" target="_self"> <img src="images/btarticle1.png" onmouseover="this.src='images/btarticle.png'" onmouseout="this.src='images/btarticle1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <a href="photos1.php" target="_self"> <img src="images/btphotos1.png" onmouseover="this.src='images/btphotos.png'" onmouseout="this.src='images/btphotos1.png'"/></div> </a> <div style="width:130px;height:55px;float:right;margin-top:1px;margin-right:160px"> <img src="images/btcd1.png" onmouseover="this.src='images/btcd.png'" onmouseout="this.src='images/btcd1.png'"/></div> </div>
SI quelqu'un peut me mette sur une piste svp le decallage se fait entre le bouton article et le bouton photo.

Merci de votre aide