Positionner 3 div dans un seul div
touta_touta
Messages postés
368
Statut
Membre
-
touta_touta Messages postés 368 Statut Membre -
touta_touta Messages postés 368 Statut Membre -
Bonjour,
je voudrais créér un menu contenant des element dont chaque element a une image et l'ombre d'une image (l'ombre et une image depuis photoshop) et sous l'image un text ,j'ai fait 3div :un pour l'image , un pour l'ombres et un pour le text ,je voudrais que ces 3 div soit l'un sous l'autre mais je sais pas comment faire ,merci de m'aider :)
voila mon code <div class="categorie">
<div class="photos">
<ul>
<li> <img src="images/tel.png" /><br /></li>
<li> <img src="images/tab.png" /><br /></li>
<li> <img src="images/bl.png" /><br /></li>
<li> <img src="images/mp3.png" /><br /></li>
<li> <img src="images/jeu.png" /><br/></li>
</ul>
</div>
<div class="ombres">
<ul>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
</ul>
</div>
<div class="textos">
<ul>
<li> Téléphone</li>
<li> Tablette</li>
<li> Bleutooth</li>
<li> Kit mp3</li>
<li> Console jeu</li>
</ul>
</div>
</div>
</div>
je voudrais créér un menu contenant des element dont chaque element a une image et l'ombre d'une image (l'ombre et une image depuis photoshop) et sous l'image un text ,j'ai fait 3div :un pour l'image , un pour l'ombres et un pour le text ,je voudrais que ces 3 div soit l'un sous l'autre mais je sais pas comment faire ,merci de m'aider :)
voila mon code <div class="categorie">
<div class="photos">
<ul>
<li> <img src="images/tel.png" /><br /></li>
<li> <img src="images/tab.png" /><br /></li>
<li> <img src="images/bl.png" /><br /></li>
<li> <img src="images/mp3.png" /><br /></li>
<li> <img src="images/jeu.png" /><br/></li>
</ul>
</div>
<div class="ombres">
<ul>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
<li> <img src="images/ombre1.png" /></li>
</ul>
</div>
<div class="textos">
<ul>
<li> Téléphone</li>
<li> Tablette</li>
<li> Bleutooth</li>
<li> Kit mp3</li>
<li> Console jeu</li>
</ul>
</div>
</div>
</div>
2 réponses
-
Bonjour,
regardes du côté de la propriété display
https://www.w3schools.com/cssref/pr_class_display.asp
PS: Pour poster du code sur le forum.. merci d'utiliser la coloration syntaxique (les balises de code).
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
Merci d'y penser la prochaine fois.
-
<div class="categorie"> <div class="photos"> <ul> <li> <img src="images/tel.png" /><br /></li> <li> <img src="images/tab.png" /><br /></li> <li> <img src="images/bl.png" /><br /></li> <li> <img src="images/mp3.png" /><br /></li> <li> <img src="images/jeu.png" /><br/></li> </ul> </div> <div class="ombres"> <ul> <li> <img src="images/ombre1.png" /></li> <li> <img src="images/ombre1.png" /></li> <li> <img src="images/ombre1.png" /></li> <li> <img src="images/ombre1.png" /></li> </ul> </div> <div class="textos"> <ul> <li> Téléphone</li> <li> Tablette</li> <li> Bleutooth</li> <li> Kit mp3</li> <li> Console jeu</li> </ul> </div> </div> </div>
EDIT : J'ai remis en place les balises de code ! (jordane)
Nb: Il faut placer ton code ENTRE les balises !!!!
