Positionnement CSS

Positionnement CSS - HTML/CSS - Programmation

Marsh Posté le 01-08-2005 à 15:01:04    

Bonjour,  
 
Je rencontre un petit soucis de positionnement CSS.
 
L'affichage entre Firefox et IE est tres tres different.
 
J'obtiens ce que je veux avec FF mais pas du tout avec IE.
 
Je vous explique le probleme, j'ai un décalage enorme sur la verticale de mes éléments.
 
J'ai placé mes div avec des positions relatives.  
 
Or, j'ai l'impression que IE ajoute les valeurs top dans les positions
 
Je sais pas si c'est alors un petit exemple :  
 
j'ai un element en top : 100px et un autre à 2OOpx de hauteur sous FF j'ai bien le premier element à une hauteur de 100 et le deuxieme à 200 mais sous IE, j'ai le premier a 100 et le deuxieme à 300 px.
 
je ne sais donc pas trop comment résoudre ce probleme, je ne remarque cela que dans les positions verticales.
 
Voici mon code : (je ne met pas tout, juste des div representatifs)
 
CSS :

Code :
  1. body {
  2.     font-family:Verdana, Arial, Helvetica, sans-serif;
  3.     font-size: 10px;
  4.     background-color:#e7eff2;
  5.     text-align:center;
  6.     color:#1b5278;
  7. }
  10. #conteneur {
  11.     margin: 0 auto; 
  12.     width:800px;
  13.     height:100%;
  14.     text-align : left;
  15. }
  19. #menuRubriques {
  20.     position : relative;
  21.     left : 0px;
  22.     top : -350px;
  23.     width : 176px;
  24.     background-color: #e7eff2;
  25.     text-align : center;
  26.     font-weight: bold;
  27. }
  30. #menuFonctions {
  31.     position:relative;
  32.     left : 210px;
  33.     top : -500px;
  34.     width : 570px;
  35.     height : 150px;
  36.     background-color: #F2F7F7;
  37.     font-weight: bold;
  38. }
  40. #conteneurLogo {
  41.     position : relative;
  42.     left : 600px;
  43.     top : -380px;
  44.     width : 136px;
  45.     height : 71px;
  46.     background-color : #F2F7F7;
  47. }
  48. #contenu {
  49.     position:relative;
  50.     top : -600px;
  51.     left : 200px;
  52.     width : 550px;
  53.     min-height: 100px;
  54.     background-color:#e7eff2;
  56. }
  60. #menuHaut{
  61. position : relative;
  62. top : 0px;
  63. left : 45px;
  64. height : 0px;
  65. /*width : 100px;*/
  66. }
  69. #menuDroite{
  70. position : absolute;
  71. left : 850px;
  72.     top : 300px;
  73.     width : 136px;
  74.     height : 150px;
  75.     font-size : 10px;
  76. }
  77. #menuHautFlash{
  78. position : relative;
  79. width : 300px;
  80. height : 50px;
  81. top : -160px;
  82. left : 270px;
  83. /*left : 202px;  
  84.     top : -162px;
  85.     width : 440px;
  86.     height : 120px;
  87.     background-color:#AA0000;*/
  88. }
  90. #diaporama{
  91. position : relative;
  92. width : 300px;
  93. height : 50px;
  94. top : -160px;
  95. left : 270px;
  96. background-color:#e7eff2;
  97. }


 
la page HTML :

Code :
  1. <div id="conteneur">
  3. <div id="imageAdmin">
  4.  ...
  5. </div>
  7. <div id="menuHaut">
  8.  ...
  10.  <div id="diaporama">
  11.   ...
  12.  </div>
  13.  <div id="menuHautFlash">
  14.   ...
  15.  </div>
  19. </div>
  22. <div id="menuRubriques">
  23. </div>
  25. <div id="contenu">
  26.  {centre}
  27. </div>
  29. <div id="menuDroite">
  31. </div>
  32. </div>


 
Vous avez le droit de dire que les noms de mes div ne sont pas parlant sur le contenu du div, mais pour moi, ils le sont, plus que si je mettais une description du contenu;)
 
Voila, quelqu'un aurait-il une solution à mon probleme???
 
Merci par avance, Karine


Message édité par karinou le 02-08-2005 à 13:44:13
Reply

Marsh Posté le 01-08-2005 à 15:01:04   

Reply

Marsh Posté le 02-08-2005 à 10:50:25    

Pourquoi personne ne veut me repondre???
Mon probleme n'est pas clair??
 
Vous voulez des screensshot??

Reply

Marsh Posté le 02-08-2005 à 10:51:36    

ben soit tu mets ta page HTML en ligne, soit tu nous poste des screenshot ca serait plus visible ton PB. Car vois tu, on a la fleme de faire un C/C de ton code dans un editeur HTML

Reply

Marsh Posté le 02-08-2005 à 11:04:58    

alors des screen pake je fais un intranet donc ilmpossible de publier la page  
 
version FF :  
[img=http://img102.imageshack.us/img102/4496/sanstitre1copie6xp.th.jpg]
 
version IE :  
[img=http://img102.imageshack.us/img102/9879/sanstitre2copie1gh.th.jpg]
 
D'autres questions???

Reply

Marsh Posté le 03-08-2005 à 13:46:51    

Désolée d'insister mais personne ne sait pencher sur mon probleme, Y a t'il une raison????
 
Svp, je suis mal, je ne sais vraiment pas comment resoudre ce probleme et j'ai une présentation de mon site vendredi au boss :s:s:s:s

Reply

Marsh Posté le 03-08-2005 à 14:17:31    

et toi tu t'es penchée sur ton problème ?
 
on a tous du boulot, on peut pas forcément répondre à tout, je verrai ce soir, rappelle le moi par MP à 18H

Reply

Marsh Posté le 03-08-2005 à 14:21:15    

Arrete les screenshot et met ton site en ligne, on aura acces a ton code.

Reply

Marsh Posté le 04-08-2005 à 08:38:30    

Gatsusat > et toi tu t'es penchée sur ton problème ?  
 
Merci beaucoup de ta reponse, une fois de plus, je ne vous comprends pas. A quoi ca sert que vous perdiez du temps à repondre pour dire ca!!
 
badze > je me repete je fais un site Intranet, je n'ai pas de moyen de mettre les pages sur un serveur et je n'ai pas internet chez moi.
 
Franchement les gars, des que je pose une question sur le forum, j'ai toujours l'impression d'etre prise pour une andouille. Ok, je suis une debutante, ok, j'ai pas votre niveau mais je suis la pour apprendre et c'est pas vraiment des reponses comme celles la qui me feront progresser...
 
Désolée de mon ennervement de ce matin, mais bon...  
 

Reply

Marsh Posté le 04-08-2005 à 08:54:30    

J'ai pas travaillé dessus tu me l'as pas rappelé par MP et donc ben je l'ai pas fait, j'ai oublié

Reply

Marsh Posté le 04-08-2005 à 08:57:50    

c'est un peu le gros bordel, revoit mieux ta mise en page. Etant donné qu'on a aucun élément pour tester jpe rien faire. Je vois a peine les blocs, genre file nous des images du bordel, upload ca, on peut pas t'aider plus, on a aucun éléménts.

Reply

Marsh Posté le 04-08-2005 à 08:57:50   

Reply

Marsh Posté le 08-08-2005 à 01:50:00    

height: 100%  :heink: Selon la page, ça peut introduire énormément de problème ...
http://www.quirksmode.org/css/100percheight.html

Reply

Sujets relatifs:

Leave a Replay

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