sderenty Posté 12 Mai 2006 Partager Posté 12 Mai 2006 (modifié) Bonjour à tous, J'ai un petit soucis de compatibilité entre IE et FF et étrangement, ça marche sous FF et pas sous IE ;-) Je m'explique : j'ai une page contenant trois div flottant (deux à gauche et le troisième à droite). Dans le div de droite, je place un nouveau div (appelons-le panier), qui est plus large que le div qui le contient. Ce panier est en position relative et décalé de 100px sur le gauche, afin de mordre sur les deux div de droite. Alors que tout se passe bien sous FF, sous IE, le div de droite s'agrandit à la taille du panier (alors que celui-ci, sorti du flux, ne devrait pas influer sur les autres div). Pour être plus simple, voici un petit exemple : <div style="width:720px;height:300px;margin:0;padding:0;float:left;background-color:black;"> <div style="width:100px;height:200px;margin:0 10px 0 0;padding:0;float:left;background-color:red;"> left </div> <div style="width:500px;height:200px;margin:0 10px 0 0;padding:0;float:left;background-color:blue;"> center </div> <div style="width:100px;height:200px;margin:0;padding:0;float:right;background-color:green;"> <div style="width:200px;height:60px;position:relative;left:-100px;margin:0;padding:0;background-color:yellow;"> Panier </div> right </div></div> (J'ai mis les styles dans la page pour faciliter vos tests). L'effet voulu est visible sous FF. Si quelqu'un a une idée, ça me dépannerait vraiment. Merci. Séb. Modifié 19 Avril 2007 par Portekoi Lien vers le commentaire Partager sur d’autres sites More sharing options...
loban Posté 12 Mai 2006 Partager Posté 12 Mai 2006 En utilisant 'margin-left' au lieu de 'left', tu obtiens la même chose entre IE et FF. <div style="width:720px;height:300px;margin:0;padding:0;float:left;background-color:black;"><div style="width:100px;height:200px;margin:0 10px 0 0;padding:0;float:left;background-color:red;"> left</div><div style="width:500px;height:200px;margin:0 10px 0 0;padding:0;float:left;background-color:blue;"> center</div><div style="width:100px;height:200px;margin:0;padding:0;float:right;background-color:green;"> <div style="width:200px;height:60px;position:relative;margin-left:-100px;background-color:yellow;"> Panier </div> right</div></div> Lien vers le commentaire Partager sur d’autres sites More sharing options...
sderenty Posté 12 Mai 2006 Auteur Partager Posté 12 Mai 2006 En utilisant 'margin-left' au lieu de 'left', tu obtiens la même chose entre IE et FF. Effectivement, ça semble marcher impec. Merci beaucoup. Séb. Lien vers le commentaire Partager sur d’autres sites More sharing options...
PierreK Posté 19 Avril 2007 Partager Posté 19 Avril 2007 Bonjour, j'ai eu exactement le même souci et confirme : utiliser left-margin au lieu de left a parfaitement fonctionné. Merci beaucoup pour cette astuce ! -- Pierre Lien vers le commentaire Partager sur d’autres sites More sharing options...
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant