Bonjour, vous!

Je me permets une rapide incursion dans cette section du forum que je fréquente assez peu, avec un problème qui me chagrine depuis quelques jours: un gros décalage de marges spécifique à IE7. Ça se passe sur www.trophallaxy.ch.
A l'heure où j'écris, ce site est en production depuis quelques semaines parce que ce problème était passé inaperçu: j'ai été dilettante et très optimiste en ayant la flemme de configurer une machine virtuelle juste pour lancer IE7 (ma grande faute!), et mes « clients » (mon frère et ses copains) ont tous des Mac ou des vieux pécés. Mais à ma décharge, le site a exactement la tête qu'il doit avoir sous Safari Mac/PC, Firefox Mac/PC et IE6.

Mes pages sont en xHTML 1.0 transitional, et ont la structure suivante:



Mon bloc principal de contenu (#contenu_int) est imbriqué dans un bloc vide (#contenu_ext) qui n'est là que pour servir de support à une image de fond pour la déco. Mais ce bloc externe reste a priori positionné correctement; c'est le bloc interne qui se décale de 140px sur la droite.
Ces éléments sont stylés de la manière suivante:



On dirait donc que sous IE7 mon bloc #contenu_int ne supporte pas d'être superposé à la barre de navigation verticale (#nav_vert), et fiche le camp à droite pour trouver de la place. Mais comme deux screenshots valent mieux qu'une longue explication vaseuse et un tas de code fumeux, voici ce que ça donne:


Click for full size - Uploaded with plasq's Skitch

NB: ici les blocs incriminés ont une bordure de couleur pour bien les distinguer!

Click for full size - Uploaded with plasq's Skitch

Alors voilà, je sèche complètement. Mais c'est la première fois que j'ai un rendu aussi différent avec IE7 que les navigateurs potables. Et ça m'enquiquine d'autant plus que sur ce coup-là IE6 ne pratiquement pas embêté: j'ai seulement dû donner une marge négative à #contenu_ext pour qu'il accepte de chevaucher la barre de navigation.
Du coup je m'en remets à la sagacité d'un cukien plus expérimenté que moi! A vot' bon coeur m'sieur dames, et merci d'avance!

Je n'ai malheureusement pas de solution directe à ton problème. Tu peux par contre utiliser l'outil "Internet Explorer Developer Toolbar" qui te permettra de voir tes objets, les styles appliqués et de corriger dynamiquement pour voir comment résoudre le problème (même si c'est un hack) sous ie7.

Il faut installer l'outil, puis tu ajoutes l'addin. Tu l'affiches (en cliquant sur l'addin dans le menu view) et tu as la toolbar qui s'affiche au bas de ton internet explorer. (Je ne peux pas te donner tous les détails du menu car je n'ai pas d'internet explorer sous les yeux).

Mais sache que je compatis pour me prendre la tête presque quotidiennement sur ce genre de problèmes!

Ta compassion me va droit au coeur!
Je suis plein d'admiration pour les gens comme toi dont c'est le métier… Quelle galère de devoir impérativement résoudre ce genre de soucis dans l'heure, sous la pression d'un client qui n'a aucune idée des difficulté rencontrés…

Merci beaucoup pour le lien! Je vais regarder tout ça, et certainement reprendre mon thème « vide » localement depuis le début pour voir à partir de quand ça commence à coincer.

Perso je mettrais une largeur fixe à la div contenu_int et je la positionnerais en alignement central sans préciser de marge ou padding. Mais moi j'y connais rien et surtout j'ai rien testé (mais c'est pas une raison (voire mêm deux) pour se taire).
PS: moi aussi je suis plein de compassion.