28172 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,

J'ai un petit soucis que je n'arrive pas à résoudre en CSS.

J'ai une série de <img /> qui sont affichées grâce à PHP,
je voudrais faire une liste de ces images.

Donc, jusqu'a maintenant, je faisais des <br /> entre chaque image, et ça faisait l'effet escompté (une colonne), mais j'aimerais faire pareil avec 3 ou 4 colonnes, et il me semble que ça se fait en CSS.

En gros, ce que je veux, c'est que CSS réajuste automatiquement mes images de façon à faire une liste par colonnes, automatiquement.

Merci de votre aide, je continue à chercher de mon côté Smiley smile
Bonsoir.

Dans ce cas, l'idéal serait une syntaxe du genre:


<ul id="liste_images">
<li><img src="tonimage1.jpg" alt="Ton alt" /></li>
<li><img src="tonimage2.jpg" alt="Ton alt" /></li>
<li><img src="tonimage3.jpg" alt="Ton alt" /></li>
<li><img src="tonimage4.jpg" alt="Ton alt" /></li>
<li><img src="tonimage5.jpg" alt="Ton alt" /></li>
<li><img src="tonimage6.jpg" alt="Ton alt" /></li>
</ul>


Comme ça, et en css:


ul#liste_images{width:xx}
/* La largeur, de préférence 3 x la largeur d'une image (Pour avoir trois colonnes) */ 
ul#liste_images li{width:xx;height:xx;float:left;margin:xx;display:block;)
/* Alors tu définis la largeur et la hauteur de chaque image, et la marge que tu souhaites avoir en eux (Sans pour autant dépassé la taille du block plus haut */ 


J'espère t'avoir aidé.