<li> qui n'occupe pas toute ma <ul> (résolu)

Bonjour à tous,

Le titre est assez explicite, j'ai une <ul> réglée à 75% de ma page, et à l'intéreur des <li> que j'ai placé à 100% (du contenant, logiquement?)...

Mais j'ai toujours un espace à droite de mes <li>, et je dois monter à environs 130% pour occuper la totalité de mon <ul> en largeur.

#menu{
width:75%;
height:auto;
list-style-type:none;
padding-right:0px;
}
#menu li{
height:30px;
padding:5px;
padding-right:30px;
display:block;
text-align:right;
width:100%;
border-bottom:1px solid #666666;
background:url(menupuce.gif) right 10px no-repeat;
}
#menu li a{
display:block;
height:30px;
padding-top:10px;
padding-right:10px;
}
#menu li a:hover{
display:block;

Vous avez une petite idée?

J'ai pourtant ajouté en début de style le sélecteur universel avec les padding et margin à 0...

Malgrè mes recherches, je bloque...

Merci à tous,

Vermichou
Modifié par vermichou (02 Feb 2008 - 18:34)

Je pense que le souci vient des tes padding appliqués sur les href qui sont block alors que ce sont des balises en inline.
A savoir que les padding sous IE et FF ne sont pas interprétés de la meme maniére par le moteur de rendu. Je te laisse regarder sur le web des exemples précis sur ce souci (pour les border aussi). (en gros IE pour calculer la largeur il ajoute les padding.. quel c** ce IE).

P'tites remarques sur ta CSS :
- Par défaut la propriété height est en auto.
- <li> est une balise de type block

A savoir qu'un type block prend toute la place qu'il peut..

A mon avis, va matter la différence entre un type block et inline, ca aide énormément en CSS.

Salut à tous,

Problème résolu... et posé bêtement... mon menu était en fait dans un conteneur de 75%... donc mon menu faisait 75% de 75%...

And the penny's dropped!

Merci geof,

Vermichou