28172 sujets

CSS et mise en forme, CSS3

Bonjour,

j'en viens à votre aide car je dois sortir un site dans pas longtemps, et tout va bien coté Navigateurs dits récents, sauf sous IE6 où un bug persiste et pas des moindres...

Le site en question est celui d'un Pilote vtt trial marc caisso

Le seul problème que je cherche à me faire aider ici et le soucis de la "sidebar" a replacer sur la droite coté IE6, j'ai tout testé, j'ai échoué...

Merci énormément d'avance.

ps : j'ai voulu lire les indications sur ce lien : http://forum.alsacreations.com/ad-4-18-A-lire-avant-de-poster-dans-ce-salon-Methodologie-.html mais certains liens sont "morts".
Modifié par Kijer (13 May 2009 - 15:26)
Administrateur
Bonjour,

Raphaël vient de corriger les liens morts Smiley smile

Tu sembles dans un premier temps avoir le doubled margin float bug dans la sidebar sur le calendrier et l'image entourée de rouge.
Ensuite le fond du div de gauche est trop large. Soit c'est un problème d'absence de hasLayout (commentaire conditionnel et zoom: 1;), soit tu as une largeur et un padding qu'IE6 interprétera différemment.
Pour déboguer, je te conseille de remplacer les jolies images de fond par des flashy
background-color: pink/hotpink/lightgreen/blue/yellow/etc;
partout où tu le peux et ainsi voir immédiatement la différence entre IE6 et le reste du monde. Smiley lol
Ton problème vient du fameux bug des doubles margin.

Sous IE6, tout élément floaté en left voit sa margin-left doublée (et réciproquement en right).

Chez toi, tes
.article, #calendrier, #images_divers, .sponsor, #texte_edito
subissent tous ce bug.

Pour corriger, il faut que tu mettes dans une css spécifique IE6
.article, #calendrier, #images_divers, .sponsor, #texte_edito { display:inline; }

Ca devrait aller mieux déjà après ca.
Modifié par Gudoy (18 Feb 2009 - 11:19)
Merci à vous, j'ai envie réussi !

Vous ne pouvez pas vous imaginer comme cela m'enlève une épine du div ... (ca va terminer en citation lol)

C'était bien ce "bug", que j'avais jamais entendu parlé.
J'ai donc appliqué la règle display:inline; et zou tout rentre dans l'ordre... magnifique..

un GRAND merci..

ps : il y a un article en francais qui traite de ce "bug" afin d'agrandir mon expérience ?

Merci encore...