Float: left qui ne fonvtionne qu'a moitié ?

Des livres incontournables pour tout maîtriser

Auteur
NeepNeep	# 21 Feb 2012, 23:41:16
47 Posts	Bonjour, je suis entrain de créer une galerie pour un client mais j'ai une petite surprise inattendu lorsque je met plus de 8 images : J'ai beau chercher pourtant je ne trouve pas..... Vois si le css de chaque image ("boîte"): `.project{ width: 160px; float: left; margin: 50px 25px 25px 25px ; display: inline; /* par sécurité mais inutile, sa ne change rien si je l'enlève... / position: relative; / par sécurité mais inutile, sa ne change rien si je l'enlève... */ }` et le html <div class="project"> <div id="the_project"> <a href="http://www.xxxxxxxxx.com/wordpress/portfolio/etiam-eget-quam-in/" class="project-picture"><img width="150" height="150" src="http://www.xxxxxxxxx.com/wordpress/wp-content/uploads/2012/02/Fotolia_1926744_L-150x150.jpg" class="attachment-thumbnail wp-post-image" alt="soul mirror" title="soul mirror" /></a> <a href="http://www.xxxxxxxxx.com/wordpress/portfolio/etiam-eget-quam-in/" ><h4 class="project-name">Etiam eget quam in</h4></a> </div><!-- end #the_project --> </div><!-- end .project --> Théoriquement je ne devrai pas avoir de problème et avoir des lignes de 4 photos..... Merci de votre aide Et désolé mais je ne peut vous fournir de version en ligne mais je peut vous apporter des détails sup Modifié par NeepNeep (21 Feb 2012 - 23:42)
47 Posts
marc.suisse	# 22 Feb 2012, 08:04:25
186 Posts	Salut Comment veux-tu placer les images ? Ce serait peut être bien que tu nous mettes ton code complet.
186 Posts
Clair de Lune	# 22 Feb 2012, 08:06:15
62 Posts	Je pense qu'il suffirait de donner une hauteur minimale au bloc encadrant l'image et sa description, non ?
62 Posts
94bri37	# 22 Feb 2012, 11:18:12
33 Posts	L'utilisation de display:inline-block convient parfaitement à ton cas. Je te suggère la lecture de cette article pour plus de détail : http://www.alsacreations.com/article/lire/1209-display-inline-block.html X
33 Posts
NeepNeep	# 22 Feb 2012, 13:52:47
47 Posts	Merci! la position diplay: inline-block fonctionne parfaitement mais un nouveau souci apparaît: C'est le nom du projet lorsqu'il est sur 2 lignes qui modifie l'affichage et décale les vignettes...... Je ne trouve pas de solution....et min-height ne marche pas Merci de votre aide Modifié par NeepNeep (22 Feb 2012 - 13:54)
47 Posts
NeepNeep	# 22 Feb 2012, 15:10:07
47 Posts	Résolu un vertical-align: top; à résolu mon problème Modifié par NeepNeep (22 Feb 2012 - 15:10)
47 Posts
Clair de Lune	# 22 Feb 2012, 15:10:15
62 Posts	NeepNeep a écrit : ...et min-height ne marche pas Et si tu définis la hauteur de la boîte avec height:200px (à régler selon l'affichage) ?
62 Posts
NeepNeep	# 22 Feb 2012, 16:29:03
47 Posts	Je crois que sa ne marchait pas non plus mais là sa marche avec display: inline-block;
47 Posts
Prévenir un modérateur