Donner une taille widht="X%" à une <li>.Est-ce Possible?

J'ai envi de faire un menu en ligne classe mais j'y arrive pas...

31 mai 2006 à 14:56:53

Bonjour à tous ! J'ai un petit gros problème qui me bloque mon aprêm de création. Je suis un débutant en Css et j'aimerai savoir si il est possible de donner une taille à des <li>. Mon but est de remplir un bloc <div> taille 50% par 5 petite <li> en inline. J'ai donc pensé que pour cela il me fallait juste donner une tailler de 10% à chacun de mes <li> et ainsi ça ferait 50%... mais je pense que j'ai vraiment tout faut car je n'y arrive pas !
Image utilisateur

Voici à peu près le résultat que j'aimerai obtenir. Donc si il éxiste un autre moyen un peu moins stupide d'arriver à ce résultat, je suis preneur ! Merci d'avance pour les futurs réponses !

yöm

31 mai 2006 à 15:22:36

tu peux pas appliquer de longeur à une balise inline, mais tu peux les mettre en flottants

Anacondange

31 mai 2006 à 19:44:57

Euh et ça va servir à quoi si je fais ça? oO pasque je vois pas trop l'intêret de mettre en float... Enfin bon si vraiment j'y arrive pas j'me met au flash

comme ça j'pourrai dessiner tranquille sans contrainte ! Mais si quelqu'un peut m'éclairer ça m'évitera de douleureuses heures d'apprentissage de Flash ! Surtout que M@téo nous a pas fait de tutorial la dessus :'(

!
Merci à l'équipe du site et merci aux gens qui aident sur les forums

Anonyme

31 mai 2006 à 19:56:05

en les mettant en float ils se mettront les uns à côté des autres

Anacondange

31 mai 2006 à 20:06:58

Mais ils sont déjà les uns à côté des autres car j'ai fait un display:inline sur les <li> le blème c'est que je trouve qu'il n'occupe pas assez d'espace et moi je voudrais que les 5 titres occupe la totalité de l'espace. Enfin je vais quand même aissayer avec mes flaots

merci !

strucky

31 mai 2006 à 20:49:07

Si ta page n'est pas extensible, c'est faisable, sinon, c'est impossible à moins d'enlever les bordures.

Anacondange

1 juin 2006 à 20:38:27

A zut... Car mon Objectif est quand même de faire un design accessible à tous... et oui je pense aussi au pauvre gens qui navigue encore sur un écran 15pouces... lol Enfin c'est pour ça que je veux faire un design extensible.
Sinon j'ai à peu près réglé mes problèmes ! Le résultat ressemble de plus en plus à ce que j'espéré ! Mais il reste un probleme...

Je n'arrive pas à centrer mon menu horizontal T_T j'ai aissayer les
margin: auto;
text-align: auto;
margin-left: 25%;
<center></center>
...
Mais rien ne marche ! C'est vraiment très chiant ! Je vous mets mes codes

<ul id="menu">
<li>Nous</li>
<li>Photos</li>
<li>Vidéo</li>
<li>Dates</li>
<li>Niouz</li>

</ul>

Et le code CSS :

li
{
background-image: url("btop.png");
background-repeat: repeat-x;
display: inline;
padding-right: 12%;
color: #FFD600;
float:left;
background-color:#004080;

border : 1px solid black;
font-size:18px;
font-family: "Comic Sans MS";

}

li:hover
{text-align: center;
display: inline;
padding-right: 12%;
color: #004080;
float:left;
background-color:#FFD600;
border : 1px solid black;

}

Dois-je mettre une photo du résultat obtenu? Bon je vais le faire pour plus de clareté

Merci d'avance !