Décallage sous IE

Décallage sous IE - HTML/CSS - Programmation

Marsh Posté le 13-08-2008 à 18:08:27    

Salut,
 
Le design de mon site n'a pas de problèmes avec FF ou Opera.
En revanche, sous IE, j'ai un vieux décalage vers la gauche de 40 pixels (je crois) sans comprendre pourquoi. :/
 
Est ce que certains auraient une idée ?
 
Le site est en PHP, fonctionne avec un CSS, et... voilà. ;)
 
Merci d'avance. :jap:

Reply

Marsh Posté le 13-08-2008 à 18:08:27   

Reply

Marsh Posté le 13-08-2008 à 22:38:24    

Bonsoir,
 
Tu pourrais nous donner l'url de ton site stp ?
 
D'avance merci
@++

Reply

Marsh Posté le 13-08-2008 à 22:41:53    

Oui, le voilà : Url
 
Merci :)

Reply

Marsh Posté le 13-08-2008 à 22:44:22    

Commence déjà par corriger les erreurs de balisage (passe le au validateur, tu comprendras).

Reply

Marsh Posté le 13-08-2008 à 22:46:26    

Pas de pb sous IE7.


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 22:59:03    

@gebruik : Comment je fais pour le passer au "validateur" ? Je ne sais pas ce que c'est en fait. :$
 
@Dj YeLL : Ah oui, je parlais sous IE6. ;)
Quoique IE7, il y a des soucis avec le menu déroulant non ?
 
Merci pour vos réponses. ;)

Reply

Marsh Posté le 13-08-2008 à 23:02:27    

Raito33 a écrit :

@gebruik : Comment je fais pour le passer au "validateur" ? Je ne sais pas ce que c'est en fait. :$

 

@Dj YeLL : Ah oui, je parlais sous IE6. ;)
Quoique IE7, il y a des soucis avec le menu déroulant non ?

 

Merci pour vos réponses. ;)

 

Pour le pb de décalage du menu sous IE7, c'est à cause de ton margin-left à -40px

 

Je vais lancer une VM avec IE6 pour tester, je te tiens au courant


Message édité par Dj YeLL le 13-08-2008 à 23:03:13

---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:03:51    

Mais si je mets pas mon margin-left à -40, c'est décallé sous FF et Opera. :/
 
Il n'y a pas moyen de trouver quelque chose pour associer les deux ?
 
Merci pour les tests ;)

Reply

Marsh Posté le 13-08-2008 à 23:06:27    

Raito33 a écrit :

Mais si je mets pas mon margin-left à -40, c'est décallé sous FF et Opera. :/
 
Il n'y a pas moyen de trouver quelque chose pour associer les deux ?
 
Merci pour les tests ;)


 
Il n'y a pas de raison pour le mettre.
 
Vérifie que tu as bien viré le padding aussi.


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:08:28    

Ben, à la base, ils servent pour recentrer sous FF/Opera.
Je viens de virer le margin, et ça a décallé (en local)
 
En padding, j'ai ça :
 
#menu2 li {
text-align : left;
padding-left : 10px;

Reply

Marsh Posté le 13-08-2008 à 23:08:28   

Reply

Marsh Posté le 13-08-2008 à 23:09:11    

Balance la version sans le margin ;)


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:09:51    

Ok, ça marche, j'up ça. ;)
 
Edit: C'est fait. Apparemment, pas de soucis en ligne. ôO


Message édité par Raito33 le 13-08-2008 à 23:11:08
Reply

Marsh Posté le 13-08-2008 à 23:13:02    

J'ai tjs le décallage sous IE là ... t'es sûr d'avoir uploadé la bonne version ?
 
Quoiqu'il en soit :

Code :
  1. #menu2 ul{
  2.    /* Tes styles existants */
  3.    margin: 0px;
  4.    padding: 0px;
  5. }


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:15:13    

Ah merde.
 
Oui, c'est la bonne version pourtant, j'ai viré la ligne du "margin"
 
J'ai ça :
 
#menu2 ul{  
width : 141px ;  
height : 26px;
list-style : none;
font-weight : normal;
text-transform : capitalize; }

Reply

Marsh Posté le 13-08-2008 à 23:16:56    

Faut pas "virer" le margin, dans le sens ne pas mettre la ligne, mais dans le sens de le mettre à 0 :D
 

Code :
  1. #menu2 ul{  
  2.    width : 141px;
  3.    height : 26px;
  4.    list-style : none;
  5.    font-weight : normal;
  6.    text-transform : capitalize;
  7.    margin: 0px;
  8.    padding: 0px;
  9. }


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:18:47    

Ah ok, au temps pour moi ^^'
 
Je modifie ça de suite et je re-up alors. :D
 
C'est fait. :)
 
Edit: Le menu est bon au niveau horizontal sous IE6 :D


Message édité par Raito33 le 13-08-2008 à 23:19:49
Reply

Marsh Posté le 13-08-2008 à 23:19:31    

It works \o/

 

Bon restent les autres problème maintenant :o


Message édité par Dj YeLL le 13-08-2008 à 23:19:47

---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:20:56    

Oui, le menu est bon sous IE6 ! :)
 
Les cases sont par contre trop "hautes", tu saurais d'où ça peut venir ?
 
Enfin, j'ai aussi un décalage du bloc "texte", le truc au centre, de la même manière que pour le menu. Ca serait la même origine ?
 
Merci pour ton aide en tout cas :jap:
 
Edit: Je viens de regarder mon CSS, ça, c'est louche...
 
#bloc_centre{  
width : 854px;  
padding-bottom : 10px;
background : #404040;
margin-left : 165px !important;
margin-left : 115px ;
text-align : left;}


Message édité par Raito33 le 13-08-2008 à 23:24:01
Reply

Marsh Posté le 13-08-2008 à 23:24:45    

Tu n'as pas le dernier élément de ton menu qui retourne à la ligne sous IE6 ? :??:


Message édité par Dj YeLL le 13-08-2008 à 23:24:51

---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:25:52    

Si, c'est fort possible que ce soit ça.
 
Parce que la distance avec le haut de la case est bon (ou du moins, à l'air, j'ai pas vérifié au pixel)

Reply

Marsh Posté le 13-08-2008 à 23:26:24    

Remplace ça :
 

Code :
  1. margin-left : 165px !important;
  2. margin-left : 115px;


 
Par ça :

Code :
  1. margin: 0px auto;


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:29:56    

Ok ça marche.
 
Je remplace ça et j'upload.
 
Pour le retour à la ligne, ça peut se modifier ?
 
-> Parfait pour le décalage du "body"
 
Edit: Merde, j'ai le décalage du menu vertical aussi. Toujours trop à gauche les écritures. ;)
 
Voilà son CSS si t'as une idée ^^
 
#menu {
position : absolute ;  
left : 12px ; ?
top : 95px ;
text-align : left;
background : transparent top left no-repeat; }
 
 
#menu ul{  
width : 100px;  
height : 275px;  
list-style : none;
margin : 8px 0 0 12px; ?
text-transform : uppercase; }
 
#menu li{
margin : 0;
padding :  0;
list-style : none;  
line-height : 30px;
text-align : left;
text-indent : 5px; }
 
#menu li a {
background : transparent url(images_site/bg_menu.gif) bottom no-repeat;  
width : 120px;
display : block;
height : 30px;
text-decoration: none;
margin :  0;
padding : 0;
list-style : none;
color  : #000000 }
 
 
#menu li a:hover {
background : transparent url(images_site/bg_menu_ov.gif) bottom no-repeat;  
height : 30px; }


Message édité par Raito33 le 13-08-2008 à 23:31:45
Reply

Marsh Posté le 13-08-2008 à 23:34:03    

Sorry, I'm going to sleep now :o
 
La suite demain \o/


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 13-08-2008 à 23:37:07    

Ok, je t'attends demain pour de nouvelles aventures :D
 
Merci pour ton aide en tout cas. ;)

Reply

Marsh Posté le 14-08-2008 à 16:24:00    

Voilà ce que j'ai trouvé comme soucis restants sous IE6 :
 
- Menu vertical d'en haut à gauche décalé sur la gauche
- Saut de ligne dans les cases "déroulées" du menu déroulant horizontal
- Répétition du bas sur certaines pages (Audio.php en particulier) qui n'a pas lieu sous FF
- Bas placé en vrac dans les News  
 
Si vous avez des idées, en particulier maître Dj YeLL qui était chaud hier ! :D


Message édité par Raito33 le 17-08-2008 à 12:11:41
Reply

Marsh Posté le 14-08-2008 à 19:50:36    

Tu fais bien de remonter :o J'avais oublié :o
 
T'as cherché au moins depuis hier soir ? :whistle:


---------------
Gamertag: CoteBlack YeLL
Reply

Marsh Posté le 15-08-2008 à 12:59:52    

Ben, avant de poster le topic, j'avais modifié ce que je pouvais.
 
Mais là, je comprends pas vraiment en fait. :spamafote:
 
Pour le menu, j'ai tenté en virant les parties colorées dans un de mes posts au dessus, sans succès. :spamafote:
 
Pour le saut de ligne, je vois pas, il n'y a pas de <br/> ou autre dans la page à cet endroit là. :/
 
Et la répétition du bas, j'aurais pensé que ça venait d'un div ou d'une connerie comme ça mais... :/


Message édité par Raito33 le 17-08-2008 à 12:11:51
Reply

Marsh Posté le 15-08-2008 à 19:10:51    

Pas d'idées ?

Reply

Marsh Posté le 16-08-2008 à 01:37:18    

deja en haut de la css tu mets
ul , li {margin:0;padding:0;}
ca sera fait une bonne fois pour toutes et ca t evitera de le repeter 15 fois
ou encore mieux tu utilises une reset css qui t evitera ce genre de desagréments
http://meyerweb.com/eric/thoughts/ [...] -reloaded/
 
pour le menu vertical t as foutu un line height de 30 px alors que tu veux que ton a fasse 25px
sur ie height et width sont l equivalent css de min-height et min-width donc tes a font naturellement 30px de haut
 
pour le menu horizontal c ets tout simplement que ton dl est trop large enleve un pixel


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 17-08-2008 à 12:11:03    

Merci pour ta réponse ;)
 
Pour le menu vertical, le soucis, c'est que les écritures du menu sont décalées sur la gauche en fait.
 
Pour le menu horizontal, j'ai testé mais ça ne change rien. :/
 
Edit: J'ai réparé le coup des liens, j'avais juste up' le mauvais CSS.  :sweat:
J'ai édité le post où sont recensés mes soucis. :D


Message édité par Raito33 le 17-08-2008 à 12:12:06
Reply

Marsh Posté le 22-08-2008 à 14:33:46    

Up!

Reply

Marsh Posté le 22-08-2008 à 15:34:08    

bah j ai toujours la vieille css...(les liens trop hauts)
pour le decalage a gauche c ets ton padding de 40px
et pour le menu vertical chez moi ca marche
au pire si enlever un pixel suffit pas t en enleve deux


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 22-08-2008 à 16:04:06    

mIRROR a écrit :

bah j ai toujours la vieille css...(les liens trop hauts)
pour le decalage a gauche c ets ton padding de 40px
et pour le menu vertical chez moi ca marche
au pire si enlever un pixel suffit pas t en enleve deux


 
Merci pour ta réponse !
 
J'ai up lesite2 aussi comme CSS.
Sur les deux, j'avais margin 0 et padding 0 dans ul et li. ;)
J'ai ajusté ensuite le margin et ça marche bien sous FF3 et IE6 !
Soucis du menu vertical réglé merci ! :)
 
Je diminue le dl du menu horizontal maintenant pour voir tout ça ;)

Reply

Marsh Posté le 22-08-2008 à 16:11:49    

Pour le menu horizontal, quand je diminue le dl (j'ai fait jusqu'à 130 pour tester), ça diminue les 'titres' en fait, pas les cases qui se déroulent. :/

Reply

Marsh Posté le 22-08-2008 à 16:25:38    

la width est a 116 et tu l as diminuée jusqu a 130 ? :sweat:


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 22-08-2008 à 16:40:39    

Elle est de 116 pour 1024*768.
 
J'ai mis 140 pour 1280*1024 et plus. ;)
 
Donc oui, j'ai bien diminué jusqu'à 130. :jap:

Reply

Marsh Posté le 22-08-2008 à 17:30:24    

j ai fait des tests avec tes deux css et ca marche :/


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 22-08-2008 à 17:33:52    

Tu es sous IE6 ?
 
Parce que j'ai toujours ce saut de ligne moi. :/

Reply

Marsh Posté le 22-08-2008 à 17:42:34    

ie6 oui
sur la css1 je n ai rien a toucher ca rentre tout seul
et sur la deux j ai juste enlevé deux pixels


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 22-08-2008 à 20:04:37    

C'est bizarre comme truc.
J'ai aussi IE6, et avec le CSS1, ben j'ai un saut de ligne clair que je n'ai pas sous FF.
 
Je vais enlever 2px sur le 2 alors si ça ne te pose plus de soucis quand tu le fais. Je vais up' ça après. :jap:
 
Merci

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

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