Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1545 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Probleme IE

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Probleme IE

n°1889356
zebus85
Posté le 29-05-2009 à 11:38:21  profilanswer
 

Bonjour à tous!
 
J'ai un problème sur mon site avec l'alignement d'un cadre sous Internet Explorer car cela fonctionne parfaitement sous firefox...   Ce qui est tres embettant vu la quantité de gens sur IE.
Donc je suppose qu'il y a une erreur dans mon code si quelqu'un peut m'aider à la reperer ça serait super.
 
site:  http://bilooba.javabien.fr              (site de test)
 
En vous remerciant d'avance

mood
Publicité
Posté le 29-05-2009 à 11:38:21  profilanswer
 

n°1889371
zebus85
Posté le 29-05-2009 à 11:53:14  profilanswer
 

ah oui juste pour dire que en local quand je fait apercu dans IE ou un autre tout marche très bien, il n'y a pas de problème d'alignement.
 
Cela se produit uniquement quand il est en ligne. Ce pourrait t-il que ça vienne de l'hebergeur?

n°1889372
olivthill
Posté le 29-05-2009 à 11:54:07  profilanswer
 

Je n'ai pas été voir le site, mais je suppose que ce serait le problème habituel des marges. Il faut les définir explicitement au niveau du body, sinon le navigateur prend des valeurs par défauts qui ne sont pas tout à fait les mêmes selon les navigateurs. Donc, avoir :

body {  
  margin: 0;
  padding: 0;  
}

n°1889377
zebus85
Posté le 29-05-2009 à 11:59:57  profilanswer
 

La on parle du fichier css?  Car si oui c'est en effet les valeur que j'avais.
Je poste mon fichier css pour y voir plus clair.
 

Code :
  1. #free-flash-header a, #free-flash-header a:hover {
  2. color : #c2cae0;
  3. }
  4. #free-flash-header a:hover {
  5. text-decoration : none;
  6. }
  7. body {
  8. margin : 0 0;
  9. padding : 0;
  10. background : #ffffff;
  11. font : normal 11px Arial, helvetica, sans-serif;
  12. color : #31333b;
  13. }
  14. #header {
  15. width : 850px;
  16. height : 200px;
  17. margin-left : auto;
  18. margin-right : auto;
  19. }
  20. #menu {
  21. width : 850px;
  22. height : 45px;
  23. margin : 0 auto;
  24. background : #8fa819;
  25. }
  26. #menu ul {
  27. margin : 0;
  28. padding : 0 0 0 0;
  29. list-style : none;
  30. }
  31. #menu li {
  32. display : inline;
  33. }
  34. #menu a {
  35. display : block;
  36. float : left;
  37. margin-left : 20px;
  38. height : 25px;
  39. padding : 15px 10px 0 10px;
  40. border-bottom : 4px solid #330010;
  41. text-decoration : none;
  42. text-transform : uppercase;
  43. font-size : 12px;
  44. font-weight : bold;
  45. color : #ffffff;
  46. border-bottom-color : #ffcd04;
  47. }
  48. #menu a:hover {
  49. border-bottom-color : #ffcd04;
  50. background : #ffcd04;
  51. }
  52. #menu .active a {
  53. border-bottom-color : #ffcd04;
  54. background : #ffcd04;
  55. }
  56. #content {
  57. width : 850px;
  58. margin : 0 auto;
  59. border-top : 1px solid #ffffff;
  60. border-bottom : 1px solid #ffffff;
  61. text-align : justify;
  62. }
  63. #right {
  64. width : 540px;
  65. padding : 0;
  66. margin-left : 20px;
  67. float : right;
  68. }
  69. #left {
  70. width : 250px;
  71. margin : 0 auto;
  72. float : left;
  73. padding : 20px;
  74. padding-top : 0;
  75. }
  76. #footer {
  77. width : 850px;
  78. margin : 0 auto;
  79. padding : 3px 0;
  80. height : 50px;
  81. border-top : 2px solid #ffffff;
  82. background : #8fa819;
  83. }
  84. #footer p {
  85. margin : 0;
  86. padding-top : 15px;
  87. text-align : center;
  88. font-size : 11px;
  89. color : #ffffff;
  90. }
  91. #footer a {
  92. color : #ffffff;
  93. }
  94. #footer a:hover {
  95. color : #ffffff;
  96. }
  97. h1, h2 {
  98. color : #8fa819;
  99. font-family : "Trebuchet MS", arial, helvetica, sans-serif;
  100. font-weight : bold;
  101. font-size : 15px;
  102. padding-left : 12px;
  103. background : url(images/arrow.gif) no-repeat left center;
  104. text-transform : uppercase;
  105. }
  106. .blue {
  107. color : #3f71b6;
  108. font-weight : 800;
  109. }
  110. .bluesquare {
  111. color : #3f71b6;
  112. font-weight : 800;
  113. padding-left : 12px;
  114. background : url(images/square.gif) no-repeat left center;
  115. }
  116. a {
  117. color : #3f71b6;
  118. }
  119. a:hover {
  120. color : #3f71b6;
  121. text-decoration : none;
  122. }
  123. hr {
  124. width : 100%;
  125. height : 1px;
  126. color : #8fa819;
  127. background-color : #8fa819;
  128. }
  129. #holder {
  130. position : absolute;
  131. top : 0;
  132. left : 0;
  133. }
  134. #copy {
  135. clear : both;
  136. }
  137. html, body, #holder {
  138. height : 100%;
  139. width : 100%;
  140. height : 100%;
  141. }
  142. html > body, html > body #holder {
  143. height : auto;
  144. }
  145. #free-flash-header a:hover {
  146. color : #cdd2d7;
  147. text-decoration : none;
  148. }
  149. #resol {
  150. text-align : left;
  151. font-family : Verdana, Arial, Helvetica, sans-serif;
  152. position : fixed;
  153. padding-left : 10px;
  154. width : 290px;
  155. top : 0;
  156. left : 1280px;
  157. margin : 0 auto;
  158. background : #bfc6d9;
  159. }
  160. #resol h1 {
  161. background : none;
  162. font-size : 1.2em;
  163. letter-spacing : 10px;
  164. padding : 0;
  165. margin : 0;
  166. border : 0;
  167. }
  168. #resol h2 {
  169. font-size : 0.6em;
  170. letter-spacing : 3px;
  171. padding : 0;
  172. margin : 0;
  173. background : none;
  174. }
  175. #holder #content #right p {
  176. text-align : center;
  177. }


Message édité par zebus85 le 29-05-2009 à 12:01:37
n°1889384
zebus85
Posté le 29-05-2009 à 12:11:41  profilanswer
 

Apres avoir fait des vérifications il me dit que j'ai une erreur sur cette ligne:
 

Code :
  1. #resol {text-align:left;font-family:Verdana, Arial, Helvetica, sans-serif;position:fixed;padding-left:10px;width:290px;top:0px;left:1280px;margin:0 auto;background:#bfc6d9;} #resol h1 {background:none;font-size:1.2em;letter-spacing:10px;padding:0px;margin:0px;border: 0px;} #resol h2 {font-size:0.6em;letter-spacing:3px;padding:0px;margin:0px;background:none;}


 
Notemment le fixed qui n'est pas pris en charge mais ça na peut être aucun rapport.


Message édité par zebus85 le 29-05-2009 à 12:12:37
n°1889396
olivthill
Posté le 29-05-2009 à 12:28:30  profilanswer
 

Peut-être qu'il faudrait mettre absolute à la place de fixed.

n°1889399
zebus85
Posté le 29-05-2009 à 12:33:02  profilanswer
 

En effet une fois absolute mis je n'ai pu de probleme dans ma vérification de la page mais malheureusement ça ne resout pas mon probleme d'alignement.  Pfff c'est abusé je suis sur que c'est un truc tout bête ...  Bloqué sur ça ça me fait perdre trop de temps...  
 
m'enfin merci de m'aider :)


Message édité par zebus85 le 29-05-2009 à 12:33:24
n°1889423
zebus85
Posté le 29-05-2009 à 13:41:41  profilanswer
 

yessss   j'ai réussi voilà ce que j'ai fait:
 
a la base j'ai ça :
 

Code :
  1. # #right {
  2. # width : 540px;
  3. # padding : 0;
  4. # margin-left : 20px;
  5. # float : right;
  6. # }
  7. # #left {
  8. # width : 250px;
  9. # margin : 0 auto;
  10. # float : left;
  11. # padding : 20px;
  12. # padding-top : 0;


 
en remarquant que ça correspond à mes 2 cadres je me dit qu'ils doivent être identiques dans leur code à la difference de la gauche et droite donc je modifie le margin-left : 20px; en margin : 0 auto;
le résultat est impécable :)
 
merci quand même pour l'aide ;)


Message édité par zebus85 le 29-05-2009 à 13:43:46
n°1928933
pieroxy
Posté le 05-10-2009 à 11:33:41  profilanswer
 

Merci de considérer l'initiative d'information autour de IE. Ca devient de plus en plus fatiguant de travailler avec IE (surtout IE6) et un petit warning n'a jamais fait de mal à personne ;-)
 
http://ieai.pieroxy.net


Message édité par pieroxy le 05-10-2009 à 21:05:36
n°1933526
kamjuve
webmaster de gourls.tk
Posté le 20-10-2009 à 03:43:30  profilanswer
 

salut, la meilleur solution c est update pour la derniere version de IE sinon google chrome et firfefox pour moi IE c est nulllllll
Publicité effacée par Elmoricq


Message édité par Elmoricq le 20-10-2009 à 07:56:57
mood
Publicité
Posté le 20-10-2009 à 03:43:30  profilanswer
 

n°1933537
Elmoricq
Modérateur
Posté le 20-10-2009 à 07:59:00  profilanswer
 

http://www.izipik.com/images/200910/20/j0dnjnifajxjks55rm-banned.gif


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Probleme IE

 

Sujets relatifs
Probleme transparence sous IEProblème de bannière flash sous IE
Problème avec appendChild sous IEProblème de compatibilité javascript/IE
Balise Object probleme IEProbleme avec pages html et lien sous IE 7
Problème avec IEProbleme de compatibilité IE / FireFox, vraiment besoin d'aide !
petit probleme Ajax avec IEProblème sur IE mais pas sur Firefox
Plus de sujets relatifs à : Probleme IE

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.086 secondes

Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR