[HTML/CSS] padding --> Firefox ok ... IE pas ok 0o

padding --> Firefox ok ... IE pas ok 0o [HTML/CSS] - HTML/CSS - Programmation

Marsh Posté le 27-03-2007 à 10:14:31    

Bonjour à tous,
J'ai un problème avec mon menu je vais vous montrer vous aller tout de suite comprendre  
 
mon site avec Firefox en petit écran
http://img185.imageshack.us/img185/8936/firefoxpetitnp6.jpg
 
Pareil avec Firefox en grand écran
http://img201.imageshack.us/img201/294/firefoxgrandob4.jpg
 
Comme vous pouvez le voir, aucun problème avec Firefox, maintenant au tour de IE:
 
IE en petit écran:
http://img244.imageshack.us/img244/4528/iepetithy3.jpg
 
IE en grand écran:
http://img185.imageshack.us/img185/3586/iegrandnx4.jpg
 
Voilà, je pense que vous avez vu, mon menu est décalé quand on passe d'un small scrn a un full scrn sur IE. Je ne sais pas de quoi sa vient car sur Firefox il n'y a aucun problème, et c'est seulement quand on passe du petit au grand écran car si on ouvre le site directement en grand écran avec IE il n'y a pas de souci (je ne vous ai pas mis le screen mais c'est vrai je vous assure  :) ), preuve que je n'ai pas fait de faute apparente dans le code... enfin bref je vous fournis quand même les screen du code hop :
 
 
Ca c'est la structure de mon menu
http://img185.imageshack.us/img185/7367/htmlmenuod3.jpg
 
et ca c'est la partie du Css qui traite du menu
http://img221.imageshack.us/img221/5189/cssvq9.jpg
 
Aider moi SVP j'en peux plus de ce problème... sa me torture l'esprit et sa m'empêche d'avancer mon site. Faut absolument que je règle ça avant !!! Aller merci d'avance a+


Message édité par bartsword le 27-03-2007 à 10:53:02
Reply

Marsh Posté le 27-03-2007 à 10:14:31   

Reply

Marsh Posté le 27-03-2007 à 10:22:49    

putain :fou: tu connais le format jpg ou png ???
vire moi tes putains de bmp et les convertir en jpeg :fou: c'est 10x trop lourd là
et puis mets tes images sur imageshack.us pas sur ton serveur qui est lent comme un cul

Reply

Marsh Posté le 27-03-2007 à 10:31:30    

super... je vois qu'il y a une réponse à mon post, bha je m'attendais à mieux que ça quoi :/

Reply

Marsh Posté le 27-03-2007 à 10:39:19    

Tu as posté à 10h14 et il est 10h35 :o :o :o
ensuite tes images on arrive pas à les voir, alors tu lis ce que je t'ai mis et tu les mets sur imageshack.us et tu les converti en jpg ou png mais pas en bmp.
 
Comment veux-tu qu'on réponde à ton problème alors qu'on ne peut pas voir les images

Reply

Marsh Posté le 27-03-2007 à 10:42:16    

+1


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 10:42:56    

oui attend 2 sec je fais sa tout de suite

Reply

Marsh Posté le 27-03-2007 à 10:53:24    

voila c'est bon

Reply

Marsh Posté le 27-03-2007 à 11:05:06    

le peu qu'on voit de code css n'est pas suffisant pour savoir ce que tu as fait. Fais un copier/coller dans les balises [CODE] de ton code CSS depuis body. Faut qu'on sache ce que tu as appliqué à ton body, si tu as intégré ton menu dans un div... donne tout ton code de body à tout #menu


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 11:07:56    

ton menu est en absolute mais sans coordonnée left c'est normal?

Reply

Marsh Posté le 27-03-2007 à 11:15:12    

et je suis pas sur que mettre tes li en inline soit une bonne idée... mais je peux me tromper. De plus IE 5 et 5.5 n'est plus en vigueur de nos jours, alors est-ce bien nécéssaire ?


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 11:15:12   

Reply

Marsh Posté le 27-03-2007 à 12:03:27    

Code :
  1. body
  2. {
  3. width: 1024px;
  4. background-color: #A1A1A1;
  5. color: #FFFFFF;
  6. font-size: 12px;
  7. margin: auto;
  8. }
  9. #entete
  10. {
  11. width: 736px;
  12. height: 263px;
  13. margin-left: 0px;
  14. margin-top: 40px;
  15. background-image: url("images/fond/cstr/entete.gif" );
  16. background-repeat: no-repeat;
  17. }
  18. #login
  19. {
  20. width: 288px;
  21. height: 263px;
  22. margin-left: 736px;
  23. margin-top: -263px;
  24. background-image: url("images/fond/cstr/login.gif" );
  25. background-repeat: no-repeat;
  26. }
  27. #corp
  28. {
  29. width: 801px;
  30. margin-left: 217px;
  31. margin-top: -424px;
  32. padding-left: 45px;
  33. background-image: url("images/fond/cstr/corp.gif" );
  34. background-repeat: repeat-y;
  35. }
  36. #pied
  37. {
  38. width: 800px;
  39. height: 53px;
  40. margin-left: 218px;
  41. background-image: url("images/fond/cstr/pied.gif" );
  42. background-repeat: no-repeat;
  43. }
  44. #menu
  45. {
  46. width: 217px;
  47. height: 424px;
  48. margin-left: 0px;
  49. margin-top: 0px;
  50. padding-left: 0px;
  51.  background-image: url("images/fond/cstr/menu.gif" );
  52. }
  53. p
  54. {
  55. margin-top: 0px;
  56. margin-bottom: 0px;
  57. }
  58. ul
  59. {
  60. margin-top: 0px;
  61. margin-bottom: 0px;
  62. }
  63. #menu ul, li  /* utilisation de liste pour le menu */
  64. {
  65. list-style-type: none; /* suppression des puces de liste */
  66. margin: 0;
  67. padding: 0;
  68. }
  69. #menu ul
  70. {
  71. position: absolute;
  72. top: 333px;
  73. width: 80px;
  74. height: 419px;
  75. padding-top: 5px;
  76. padding-left: 60px;
  77. }
  78. #menu li
  79. {
  80. display: inline; /* correction pour IE5 et IE5.5 */
  81. }
  82. #menu li a
  83. { /* dimensions et définitions des boutons */
  84. display: block; /* mise en block de <a> pour lui donner des dimensions */
  85. height: 15px;
  86. width: 80px;
  87. font-size: 12px;
  88. font-family: Arial, "Bookman Old Style", sans-serif;
  89. color: #ffffff;
  90. text-decoration: none;
  91. line-height: 15px; /* hauteur de ligne pour éviter les paddings */
  92. }
  93. #menu li a:hover
  94. {
  95. background: transparent url(images/fond/cstr/menu.gif) top left no-repeat;
  96. }
  97. #menu a#menu1:hover
  98. { /* décalage de l'arrière-plan pour chaque bouton */
  99. background-position: -60px -460px;
  100. }
  101. #menu a#menu2:hover
  102. {
  103. background-position: -60px -475px;
  104. }
  105. #menu a#menu3:hover
  106. {
  107. background-position: -60px -490px;
  108. }
  109. #menu a#menu4:hover
  110. {
  111. background-position: -60px -505px;
  112. }
  113. #menu a#menu5:hover
  114. {
  115. background-position: -60px -520px;
  116. }
  117. #menu a#menu6:hover
  118. {
  119. background-position: -60px -535px;
  120. }
  121. #menu a#menu7:hover
  122. {
  123. background-position: -60px -550px;
  124. }
  125. #menu a#menu8:hover
  126. {
  127. background-position: -60px -565px;
  128. }
  129. #menu a#menu9:hover
  130. {
  131. background-position: -60px -580px;
  132. }

Reply

Marsh Posté le 27-03-2007 à 12:28:04    

tu ne mets jamais de float left ??
et pour quelle raison ton ul est en absolute ? Pourquoi ne pas tout mettre en relative ? du coup ca bougera plus ! et tu serais pas obligé de te taper des #menu... à chaque fois.
Dommage qu'on puisse pas se rendre compte du ce que ton menu donne, ca serait plus facile...


Message édité par dartyduck le 27-03-2007 à 12:29:29

---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 12:37:56    

Citation :

Dommage qu'on puisse pas se rendre compte du ce que ton menu donne, ca serait plus facile...


 
comment ça ?

Reply

Marsh Posté le 27-03-2007 à 12:46:03    

pourrais-tu juste me rappeler la différence entre relative et absolute stp ? Je le savais lorsque j'ai fait ce code mais comme ça fait un moment (vu que j'avais ce problème j'avais lâché l'affaire)

Reply

Marsh Posté le 27-03-2007 à 12:56:40    

Alors la lol quoi ^^ j'ai mis en relative et changer le top pour que le menu soit au même endroit... Mais alors là ... frenchement c'est indescriptible ce qu'il me fait (sur firefox c'est toujours nickel c'est encore sur IE que sa foire) mais comme c'est indescriptible je vous file le lien du site et regarder par vous même. Essayer avec IE et passer de full scrn a small scrn vous verrez ^^
 
le lien (c'est un peu lent normal) : http://10.138.133.31/site.002/

Reply

Marsh Posté le 27-03-2007 à 13:04:05    

la différence entre relative et absolute:
relative: ton bloc se positionnera par rapport au bloc précédent (d'ou l'emploi des float:left quand il le faut)
absolute: se positionnera par rapport au bloc parent, au point x=0 et y=0 (haut gauche) du parent. Il a la faculté d'etre positionné ou on veut, il viendra se placer au-dessus de tout ce que tu veux, et aussi permet de placer un logo sans perturber la mise en page, etc...
Impossible d'accéder à ton site, "IE ne peut pas afficher cette page"
Besoin de te remettre sur les rails en CSS? => http://www.siteduzero.com


Message édité par dartyduck le 27-03-2007 à 13:06:03

---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 13:16:23    

bartsword a écrit :

Alors la lol quoi ^^ j'ai mis en relative et changer le top pour que le menu soit au même endroit... Mais alors là ... frenchement c'est indescriptible ce qu'il me fait (sur firefox c'est toujours nickel c'est encore sur IE que sa foire) mais comme c'est indescriptible je vous file le lien du site et regarder par vous même. Essayer avec IE et passer de full scrn a small scrn vous verrez ^^

 

le lien (c'est un peu lent normal) : http://10.138.133.31/site.002/


C'est une adresse ip de réseau local [:moule_bite]

Citation :


% This is the RIPE Whois query server #2.
% The objects are in RPSL format.
%
% Note: the default output of the RIPE Whois server
% is changed. Your tools may need to be adjusted. See
% http://www.ripe.net/db/news/abuse- [...] 50331.html
% for more details.
%
% Rights restricted by copyright.
% See http://www.ripe.net/db/copyright.html

 

% Note: This output has been filtered.
%       To receive output for a database update, use the "-B" flag

 

% Information related to '10.0.0.0 - 10.255.255.255'

 

inetnum:         10.0.0.0 - 10.255.255.255
netname:         IANA-ABLK-RESERVED1
descr:           Class A address space for private internets
descr:           See http://www.ripe.net/db/rfc1918.html for details
country:         EU # Country is really world wide
org:             ORG-IANA1-RIPE
admin-c:         RFC1918-RIPE
tech-c:          RFC1918-RIPE
status:          ALLOCATED UNSPECIFIED "status:" definitions
remarks:         Country is really worldwide
remarks:         This network should never be routed outside an enterprise
remarks:         See RFC1918 for further information
mnt-by:          RIPE-NCC-HM-MNT
mnt-lower:       RIPE-NCC-HM-MNT
source:          RIPE # Filtered

 

organisation:    ORG-IANA1-RIPE


Message édité par gatsu35 le 27-03-2007 à 13:17:24
Reply

Marsh Posté le 27-03-2007 à 13:19:32    

Citation :

C'est une adresse ip de réseau local


merde t'as raison

Reply

Marsh Posté le 27-03-2007 à 13:22:57    

bha en fait pour vous expliquer quand je passe de full a small scrn il me déplace le menu vers la droite (il garde les même proportion entre le bord de la fenêtre en gros) et quand je place la souris dessus, il se remet au bonne endroit, je remet en full et il se déplace à gauche, je remet la souris dessus, hop il se replace et ainsi de suite... quel m****e

Reply

Marsh Posté le 27-03-2007 à 13:23:49    

par contre vive firefox :) Utilisez tous firefox j'aurais moins de problème lol


Message édité par bartsword le 27-03-2007 à 13:24:12
Reply

Marsh Posté le 27-03-2007 à 13:33:38    

wai, mais c'est pas une solution.


Message édité par dartyduck le 27-03-2007 à 13:47:24

---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 14:07:02    

c'est bon j'ai résussi à résoudre le problème avec du javascript:  
 

Citation :

<body onResize="location.reload();" >


 
parce-que en fait le menu se déplaçait mais en rafraichissant la page il se remettait, alors en rafraichissant la page automatiquement grace au javascript sa arrange le problème... Merci à tous ++

Reply

Marsh Posté le 27-03-2007 à 14:13:15    

c'est quoi cette bidouille ?? et le type qui a désactivé ses plugins javascript, il se retrouve avec un  menu tout décalé, c'est ça ?


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 14:34:26    

lol... arrête je vais jamais en finir!!! Malheureusement tu as raison :( bon je fais quoi alors ^^

Reply

Marsh Posté le 27-03-2007 à 15:30:15    

mets tout en relative car en absolute il aura tendance à bouger si tu modifie les dimensions de la fenetre. et essaie de mettre ton site en ligne pour qu'on voit ton probleme exactement


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 27-03-2007 à 15:35:29    

Et surtout avec la grosse merde que tu as fait, dès que je resize mon navigateur ou que je fait apparaitre une des barres d'outils de mon navigateur, ca reload la page, super comme truc, c'est super débile surtout

Reply

Marsh Posté le 27-03-2007 à 15:41:34    

sois pas si méchant, il est là pour apprendre et comprendre ses erreurs, pas se faire lyncher !


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
Reply

Marsh Posté le 28-03-2007 à 10:31:38    

ok je vais essayer de le mettre en ligne ce soir quand je rentre à la maison

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

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