3 colonnes : image de largeur 100% qui déborde avec ie6

Bonjoir,

J'ai un design extensible en 3 colonnes : deux barres latérales flottantes, et un div #content qui s'adapte en largeur au milieu.

Il y a une image dans ce div de largeur width:100%.

Avec firefox et ie7 => zéro souci.
ie6 => l'image dépasse surement en largeur et refuse de monter au bon endroit. Le problème est le même sur tout le site avec tout élément de largeur 100% (images, tableaux...)

La page est ici : http://vaXXXroum.net/Coordonnees-et-plan-dacces (merci de supprimer les XXX dans l'url)

C'est du single-line-css mais ça reste lisible (que les puristes me pardonnent).
Modifié par Ralfman68 (19 Aug 2008 - 01:40)

salut

je crois que tu dois utiliser :
padding:0;
marging:0;

Ce n'est pas ça car en tout début de fichier j'ai déclaré
* {padding:0;marging:0;}

Merci quand même.

J'ai pensé à un hack ie6 mais je ne saurai même pas lequel.
Mettre width:95% pour ie6 c'est pas suffisant car il faut que l'image garde les bonnes dimensions...
Modifié par Ralfman68 (19 Aug 2008 - 02:15)

Salut,

le fait de mettre un width:100%; à un bloc jouxtant un flottant dans IE6 provoque un bug lié au haslayout et qui est décrit dans ce chapitre.

Cela dit je n'ai pas vu cette déclaration dans le lien que tu donnes.

Par contre tu as un étrange * { overflow: hidden; } qui pose problème puisque chaque élément de type bloc est doté d'un contexte de formatage alors qu'à priori il ne faudrait le déclarer que pour .post (voir dans l'article la manière de procéder pour IE6).

D'une manière générale le plus simple serait de voir le tuto : Un design fluide avec trois «colonnes», grâce au positionnement flottant.

A+