Tchesko Posté 1 Décembre 2004 Partager Posté 1 Décembre 2004 Commencons par le code : #scd_nav{ width: 778px; margin: 0px; border: 1px solid #000000;}#scd_nav dl{ float: left; width: 180px; padding: 0px; border: 1px solid #000000; margin-left: 10px;}hr { margin: 0px; padding: 0px; height: 1px; clear: both; visibility: hidden;} et <div id="scd_nav"> <dl> <dt>Titre 1</dt> <dd>Texte à insérer</dd> </dl> <dl> <dt>Titre 2</dt> <dd>Texte à insérer</dd> </dl> <dl> <dt>Titre 3</dt> <dd>Texte à insérer</dd> </dl> <dl> <dt>Titre 4</dt> <dd>Texte à insérer</dd> </dl><hr /></div> Rien de très compliqué, pourtant l'exemple est assez saisissant. Sous mozilla, une marge de 10px apparait au dessus de la liste dl, sous IE elle apparait a gauche. J'ai tenté différents hack et rien n'y fait, Je cherche donc une parade à ces 2 phénomènes... A votre bon coeur... Lien vers le commentaire Partager sur d’autres sites More sharing options...
Tchesko Posté 1 Décembre 2004 Auteur Partager Posté 1 Décembre 2004 Bon, comme je n'aime pas rester les bras croisés, trop longtemps, j'ai cherché une autre solution, moins sémentique mais c'est pas grave. CSS:hr { margin: 0px; padding: 0px; height: 1px; clear: both; visibility: hidden;}#autour{ width: 778px; margin: 0px; padding: 0px; border: 1px solid #000000;}#a, #b, #c, #d{ float: left; width: 180px; padding: 0px; border: 1px solid #000000; margin-left: 10px;}#a{ margin-left: 5px;}html>body #a{ margin-left: 10px;}XHTML:<div id="autour"><div id="a"><h2>Titre 1</h2><p>Texte à insérer</p></div><div id="b"><h2>Titre 2</h2><p>Texte à insérer</p></div><div id="c"><h2>Titre 3</h2><p>Texte à insérer</p></div><div id="d"><h2>Titre 4</h2><p>Texte à insérer</p></div><hr /></div> Je conclue de cette expérience qu'IE s'amuse à doubler la valeur du margin-left du premier élément float left. Il doit bien y avoir aune autre solution moins acrobatique non? Lien vers le commentaire Partager sur d’autres sites More sharing options...
Tchesko Posté 1 Décembre 2004 Auteur Partager Posté 1 Décembre 2004 (modifié) Euh... Une petite recherche m'apprend que je peux régler le problème en ajoutant un : display: inline; Au niveau de mes boites : #a, #b, #c, #d{float: left;width: 180px;padding: 0px;border: 1px solid #000000;margin-left: 10px;} Merci, http://www.positioniseverything.net http://www.positioniseverything.net/explor...led-margin.html Par contre, il semble que cette astuce ne fonctionne pas dans les listes dl Modifié 1 Décembre 2004 par Tchesko Lien vers le commentaire Partager sur d’autres sites More sharing options...
Tchesko Posté 3 Décembre 2004 Auteur Partager Posté 3 Décembre 2004 Si si ça fonctionne très bien... 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