[XHTML] problème entre navigateurs malgré W3C (screens inside)

problème entre navigateurs malgré W3C (screens inside) [XHTML] - HTML/CSS - Programmation

Marsh Posté le 02-12-2002 à 21:35:49    

Bonjour,  
 
actuellement je m'occupe du site de rassemblement des teams HFR du forum JV et ce soir j'ai découvert l'horrible vérité : mon site ne passe pas bien sur tous les navigateurs malgré une validation W3C en bonne et due forme :/
 
Voila l'étendue des dégats :
 
le résultat normal (en tout cas souhaité) avec IE6
 
http://perso.wanadoo.fr/popok/images/screen.png
 
 
avec mozilla
 
http://perso.wanadoo.fr/popok/images/screen2.png
 
avec opera (sur une autre partie du site)
 
http://mapage.noos.fr/lila.mae/images/screen.gif
 
Soit 3 résultats différents.
 
Si vous pouviez m'aider s'il vous plait
 
le site : http://perso.wanadoo.fr/popok/
 
le fichier CSS
 

Code :
  1. body {
  2. margin:0px;
  3. padding:0px;
  4. font-family:verdana, arial, helvetica, sans-serif;
  5. color:#333;
  6. background-color:#FFF;
  7. }
  8. h1 {
  9. margin:0px 0px 15px 0px;
  10. padding:0px;
  11. font-size:28px;
  12. line-height:28px;
  13. font-weight:900;
  14. color:#000;
  15. }
  16. p {
  17. font:11px/20px verdana, arial, helvetica, sans-serif;
  18. margin:0px 0px 16px 0px;
  19. padding:0px;
  20. }
  21. #Content>p {margin:0px;}
  22. #Content>p+p {text-indent:30px;}
  24. a {
  25. color:#07a;
  26. font-size:11px;
  27. text-decoration:none;
  28. font-weight:600;
  29. font-family:verdana, arial, helvetica, sans-serif;
  30. }
  31. a:link {color:#07a;}
  32. a:visited {color:#07a;}
  33. a:hover {color:red;}
  35. .banniere{
  36. float:right;
  37. margin-right:20px;
  38. height:38px;
  39. }
  41. #Header {
  42. margin:50px 0px 10px 0px;
  43. padding:17px 0px 0px 20px;
  44. /* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
  45. height:33px; /* 14px + 17px + 2px = 33px */
  46. border-style:solid;
  47. border-color:black;
  48. border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
  49. line-height:11px;
  50. background-color:#eee;
  52. /* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity.  
  53. Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it.  
  54. IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style  
  55. declaration. The incorrect IE5/Win value is above, while the correct value is  
  56. below. See http://glish.com/css/hacks.asp for details. */
  57. voice-family: "\"}\"";
  58. voice-family:inherit;
  59. height:14px; /* the correct height */
  60. }
  61. /* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct  
  62. length values to user agents that exhibit the parsing error exploited above yet get  
  63. the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
  64. a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
  65. body>#Header {height:14px;}
  67. #Content {
  68. margin:0px 50px 50px 200px;
  69. padding:10px;
  70. }
  72. #Menu {
  73. position:absolute;
  74. top:100px;
  75. left:20px;
  76. width:172px;
  77. padding:10px;
  78. background-color:#eee;
  79. border:1px solid #000;
  80. line-height:17px;
  81. /* Again, the ugly brilliant hack. */
  82. voice-family: "\"}\"";
  83. voice-family:inherit;
  84. width:150px;
  85. }
  86. /* Again, "be nice to Opera 5". */
  87. body>#Menu {width:150px;}


 
les annotations en anglais viennent du site sur lequel j'ai récupéré les astuces pour les bugs IE5
 
merci
 
 

Reply

Marsh Posté le 02-12-2002 à 21:35:49   

Reply

Marsh Posté le 02-12-2002 à 21:54:43    

.banniere {
 padding-right: 20px;
 height: 38px;
 text-align: right;
}
 
#Header {
 margin:10px 0px 10px 0px;
...
}


 
Si tu développes un site qui suit les normes utilises plutôt Mozilla comme navigateur de référence, car dans ce cas là c'est lui qui avait raison ;)


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 02-12-2002 à 21:59:30    

gm_superstar a écrit a écrit :

.banniere {
 padding-right: 20px;
 height: 38px;
 text-align: right;
}
 
#Header {
 margin:10px 0px 10px 0px;
...
}


 
Si tu développes un site qui suit les normes utilises plutôt Mozilla comme navigateur de référence, car dans ce cas là c'est lui qui avait raison ;)




ok, merci du conseil
je vais corriger ça

Reply

Sujets relatifs:

Leave a Replay

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