problème décalage div à l'ajustement de la fenêtre sous IE

problème décalage div à l'ajustement de la fenêtre sous IE - HTML/CSS - Programmation

Marsh Posté le 17-07-2008 à 17:58:39    

Bonjour tout le monde,
 
J'ai découvert le forum il y a peu de temps et espère y trouver réponse à mon problème.
 
J'ai donc un soucis de décalage de 3 de mes <div> quand je redimensionne la fenêtre d'IE 6 et 7 ou que j'ouvre mes favoris (ou mon historique). Quand la fenêtre est ouverte "normalement" (dans tout l'écran), le positionnement est ok. J'ai essayé plusieurs solutions : position : relative; position : absolute; etc... rien n'y fait. Sous Firefox, aucun problème.
 
Voilà mon css :
 

Code :
  1. #chercher-bien {
  2. width: 144px;
  3. height: 110px;
  4. margin-left: 17px;
  5. margin-top: 12px;
  6. }
  8. #neuf {
  9. width: 143px;
  10. height: 111px;
  11. margin-left: 160px;
  12. margin-top: -110px;
  13. }
  15. #prestige {
  16. width: 284px;
  17. height: 108px;
  18. margin-left: 18px;
  19. margin-top: -213px;
  20. padding-bottom: 14px;
  21. }
  23. #reference {
  24. position: fixed;
  25. width: 299px;
  26. height: 31px;
  27. background-repeat:no-repeat;
  28. background-image: url(../images-css/reference.jpg);
  29. margin-left: 308px;
  30. margin-top: -109px;
  31. }


 
voilà la page html qui correspond :
 

Code :
  1. <a href="http://www.om.net" target="_self" onmouseup="window.open('http://www.om.net');">
  2.   <div id="chercher-bien">   
  3.       <script type="text/javascript">
  4.  var mon_image_1 = new Image();
  5.  mon_image_1.src = './images-css/chercher-un-bien2.jpg';
  6.  var mon_image_2 = new Image();
  7.  mon_image_2.src = './images-css/chercher-un-bien.jpg';
  8.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none />');
  9. </script></div></a>
  10.      
  11.       <a href="http://www.om.net" target="_self" onmouseup="window.open('http://www.om.net');">
  12.       <div id="neuf">
  13.   <script type="text/javascript">
  14.  var mon_image_1 = new Image();
  15.  mon_image_1.src = './images-css/neuf-et-vefa2.jpg';
  16.  var mon_image_2 = new Image();
  17.  mon_image_2.src = './images-css/neuf-et-vefa.jpg';
  18.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none />');
  19. </script></div></a>
  20.    
  21.     <div id="reference">
  22.      <form action="referencedunbien.html method="post name="form" onsubmit="return validation2();">
  23. <input  class="login_ref" name="reference" type="text" />
  24. <input class="bouton-ref" type="image" src="./images-css/connexion-ok.jpg"/>
  25. </form>
  26. </div>
  28. <a href="http://www.om.net" target="_self" onmouseup="window.open('http://www.om.net');">
  29. <div id="prestige">
  30.       <script type="text/javascript">
  31.  var mon_image_1 = new Image();
  32.  mon_image_1.src = './images-css/demeures-prestige2.jpg';
  33.  var mon_image_2 = new Image();
  34.  mon_image_2.src = './images-css/demeures-prestige.jpg';
  35.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none /> ');
  36. </script></div></a>


Le <div id="reference"> ne bouge pas, le soucis est sur les <div> "chercher-bien", "neuf" et "prestige". Ce problème pourrait-il ne pas aussi venir de la présence du javascript ?
 
En espérant avoir été clair. Merci d'avance pour votre aide.

Reply

Marsh Posté le 17-07-2008 à 17:58:39   

Reply

Marsh Posté le 17-07-2008 à 22:08:37    

Une balise <a> ne peut pas avoir pour élément enfant/descendant une balise <div>.
En règle générale, en XHTML, un élément de type en-ligne ne peut avoir que des éléments de type en-ligne comme descendants.

Reply

Marsh Posté le 18-07-2008 à 10:48:36    

Merci pour ta réponse.
J'ai modifié mon code suite à ta remarque mais le problème reste le même, le décalage est toujours présent sous IE. Quelqu'un verait-il une autre piste ?
 
Le code modifié :

Code :
  1. <div id="chercher-bien">
  2.    <a onmouseup="window.open('http://www.google.fr', '_self');">     
  3.       <script type="text/javascript">
  4.  var mon_image_1 = new Image();
  5.  mon_image_1.src = './images-css/chercher-un-bien2.jpg';
  6.  var mon_image_2 = new Image();
  7.  mon_image_2.src = './images-css/chercher-un-bien.jpg';
  8.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none />');
  9. </script></a></div>
  10.      
  11.       <div id="neuf">
  12.       <a onmouseup="window.open('http://www.google.fr', '_self');">     
  13.   <script type="text/javascript">
  14.  var mon_image_1 = new Image();
  15.  mon_image_1.src = './images-css/neuf-et-vefa2.jpg';
  16.  var mon_image_2 = new Image();
  17.  mon_image_2.src = './images-css/neuf-et-vefa.jpg';
  18.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none />');
  19. </script></a></div>
  21. <div id="prestige">
  22. <a onmouseup="window.open('http://www.google.fr', '_self');">
  23.       <script type="text/javascript">
  24.  var mon_image_1 = new Image();
  25.  mon_image_1.src = './images-css/demeures-prestige2.jpg';
  26.  var mon_image_2 = new Image();
  27.  mon_image_2.src = './images-css/demeures-prestige.jpg';
  28.  document.write(' <img src="'+mon_image_1.src+'" onmouseover="this.src=\''+mon_image_2.src+'\'" onmouseout="this.src=\''+ mon_image_1.src+'\'" border=none /> ');
  29. </script></a></div>


Merci

Reply

Marsh Posté le 18-07-2008 à 12:44:33    

Pas de Doctype ?
Donc IE en mode dégradé.

Message cité 1 fois
Reply

Marsh Posté le 18-07-2008 à 13:58:11    

gebruik a écrit :

Pas de Doctype ?
Donc IE en mode dégradé.


 
J'ai bien un doctype

Code :
  1. <!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">

, dans le post précédent j'ai juste mis la partie du code où est mon soucis.
 
Merci pour tes réponses.


Message édité par ndbconseil le 18-07-2008 à 14:01:37
Reply

Marsh Posté le 18-07-2008 à 14:48:30    

Tu as une URL ou regarder ton site ?

Message cité 1 fois
Reply

Marsh Posté le 21-07-2008 à 17:56:13    

gebruik a écrit :

Tu as une URL ou regarder ton site ?


 
Non, désolé, je n'ai pas d'URL. J'ai réussi à régler le problème sous IE7 en plaçant un de mes blocs avec un float et le reste avec des position:absolute. Cependant, le problème reste le même avec IE6 (je m'arrache les cheveux !!).
 
Merci de ton aide.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed