28111 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,

j'ai dans un <ul> seize <li>, contenant des images pointant vers un lien. Je voudrais que les <li> fassent 41px de large, mais que les images-liens qui y sont restent à 35x35. Mais je n'y arrive pas. Soit ça redimensionne mes images, soit ça annule le inline... Bref je n'y arrive absolument pas !

Voici mon code :

<ul>
    <li id="ligne1"><img src="http://johanchalibert.comze.com/ligne1.png" alt="Ligne 1"  /></li>
    <li id="ligne2"><img src="http://johanchalibert.comze.com/ligne2.png" alt="Ligne 2"  /></li>
    <li id="ligne3"><img src="http://johanchalibert.comze.com/ligne3.png" alt="Ligne 3"  /></li>
    <li id="ligne3b"><img src="http://johanchalibert.comze.com/ligne3b.png" alt="Ligne 3b"  /></li>
    <li id="ligne4"><img src="http://johanchalibert.comze.com/ligne4.png" alt="Ligne 4"  /></li>
    <li id="ligne5"><img src="http://johanchalibert.comze.com/ligne5.png" alt="Ligne 5" /></li>
    <li id="ligne6"><img src="http://johanchalibert.comze.com/ligne6.png" alt="Ligne 6"  /></li>
    <li id="ligne7"><img src="http://johanchalibert.comze.com/ligne7.png" alt="Ligne 7"  /></li>
    <li id="ligne7b"><img src="http://johanchalibert.comze.com/ligne7b.png" alt="Ligne 7b" /></li>
    <li id="ligne8"><img src="http://johanchalibert.comze.com/ligne8.png" alt="Ligne 8"  /></li>
    <li id="ligne9"><img src="http://johanchalibert.comze.com/ligne9.png" alt="Ligne 9"  /></li>
    <li id="ligne10"><img src="http://johanchalibert.comze.com/ligne10.png" alt="Ligne 10" /></li>
    <li id="ligne11"><img src="http://johanchalibert.comze.com/ligne11.png" alt="Ligne 11" /></li>
    <li id="ligne12"><img src="http://johanchalibert.comze.com/ligne12.png" alt="Ligne 12" /></li>
    <li id="ligne13"><img src="http://johanchalibert.comze.com/ligne13.png" alt="Ligne 13" /></li>
    <li id="ligne14"><img src="http://johanchalibert.comze.com/ligne14.png" alt="Ligne 14" /></li>

</ul>
<style>
ul {
with: 666px;
}

li {
display: inline;
list-style-type: none;
}

</style>


Merci d'avance de votre aide,

Johan Smiley cligne
salut,
tu ne peux pas dimensionner des éléments en ligne, tu dois les faire passer à "inline-block", dans ton cas, pour pouvoir leur donner une taille.

li {display:inline-block;width:41px;text-align:center}

À noter que les espaces entre les li dans ton code ressortiront sur le navigateur.