<li> et internet explorer: bug?

**le Jeu Fév 12, 2004 19:46**

Bonjour. je mets au point un site avec des css

je vous invite a jeter un oeil sur un probleme que je rencontre

megannonces dot com (svp aucun link je veux pas que gg le reference sans contenu)

sous opera, aucun probleme pour le menu en haut (hauteur de 20 px)
sous ie, la hauteur double quasiment.

voici mon code

code xhtml

Code: Tout sélectionner: <div id="menu"> <ul> <li><a href="#">Immobilier</a></li> <li><a href="#">Auto-Moto</a></li> <li><a href="#">Emploi</a></li> <li><a href="#">Rencontres</a></li> </ul> </div>

code css

Code: Tout sélectionner: #menu { background: #D7DCDF url(images/onglet_b.png) no-repeat; top: 60px; position: absolute; width: 400px; left: 300px; height: 20px; border-top: 1px solid #9CACB1; border-right: 1px Aucune #9CACB1; border-bottom: 1px solid #9CACB1; border-left: 1px solid #9CACB1; } #menu li { display: inline; padding-left: 6px; margin-left: 0px; font-size: 12px; font-variant: small-caps; height: 18px; }

si je vire les li, la taille originale de 20px est restaurée...j'en conclus que la balise li a, par defaut, une margin bottom != 0
mais meme si j'impose cette marge a 0, le probleme reste entier. Une idée?
A+++

**le Jeu Fév 12, 2004 22:37**

je vous ai collés?

**le Ven Fév 13, 2004 0:32**

Faut croire ! :mrgreen:

**le Ven Fév 13, 2004 0:52**

bon tampis, je vous en veux pas (pour cette fois hein

), c'est ie qui est collé dans l'histoire

**le Ven Fév 13, 2004 0:57**

yannouk a écrit:megannonces dot com

puis

yannouk a écrit:
Code: Tout sélectionner
<div id="menu"> <ul> <li><a href="#">Immobilier</a></li> <li><a href="#">Auto-Moto</a></li> <li><a href="#">Emploi</a></li> <li><a href="#">Rencontres</a></li> </ul> </div>

certains ont du se dire : "ouh la, un futur concurrent, il veut pas qu'on creuse notre propre tombe non plus ?" :mrgreen:

**le Ven Fév 13, 2004 11:14**

Bonjour,

Je pense que ca vient des feuilles de styles par défaut différentes selon les navigateurs.

Essaye margin-top: 0px;margin_bottom: 0px;

A+

**le Ven Fév 13, 2004 11:19**

Cette mise en page est faite avec quel doctype ?

**le Ven Fév 13, 2004 11:28**

Tu as mis les marges de UL à zéro (car elles ne le sont pas par défaut) ?

**le Ven Fév 13, 2004 14:32**

Je suis pas sur de comprendre la necessite du <li></li> dans ce cas?
j'ai l'impression que tu n'as besoin ni du <ul> ni du <li> et le resultat souhaite devrais etre facile a obtenir... maintenant j'ai peut-etre mal compris... :lol:

#menu {
background: #D7DCDF url(images/onglet_b.png) no-repeat;
top: 60px;
position: absolute;
width: 400px;
left: 300px;
height: 20px;
border-top: 1px solid #9CACB1;
border-right: 1px Aucune #9CACB1;
border-bottom: 1px solid #9CACB1;
border-left: 1px solid #9CACB1;
}
#menu a {
display: inline;
padding-left: 6px;
margin-left: 0px;
font-size: 12px;
font-variant: small-caps;
height: 18px;
}

devrais suffir a avoir le resultat voulu non?

Juste curieux ...

JM

**le Ven Fév 13, 2004 14:37**

JM > pour des raisons d'accessibilité et de sémantique, un menu se construit à l'aide de puces.

**le Ven Fév 13, 2004 16:31**

effectgivement des <a> seraient plus simple, mais comme le dit sibellius je veux cette fois respecter la semantique

pour le doctype:

Code: Tout sélectionner: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

je fais du strict mais si je mets strict ie le lit pas mais enfin ca c un autre pb

ah ben voila: je viens d'appliquer la marge 0 sur UL comme dit sibellius, et ca marche

je te remercie grandement

<li> et internet explorer: bug?

<li> et internet explorer: bug?

Re: <li> et internet explorer: bug?

Formation recommandée sur ce thème :

Lectures recommandées sur ce thème :

Qui est en ligne