Problème d'espace entre photo
tipi75
Messages postés
723
Statut
Membre
-
tipi75 Messages postés 723 Statut Membre -
tipi75 Messages postés 723 Statut Membre -
Bonsoir,
Je voudrais espacer les photos entres elles mais je n'y arrive pas. J'utilise le php afin de créer du dynamisme dans mes pages html.
Voici le script:
$contenu = '<div id="galerie"><ul id="galerie_mini">';
$contenu .= '<li><a href="images\tata\black_flower_1.jpg" title="Titre de la photo 1"><img src="images\tata\black_flower_1.jpg" width="100" border="no" alt="Le titre de la photo 1" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_2.jpg" title="Titre de la photo 2"><img src="images\tata\black_flower_2.jpg" width="100" border="no" alt="Le titre de la photo 2" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_3.jpg" title="Titre de la photo 3"><img src="images\tata\black_flower_3.jpg" width="100" border="no" alt="Le titre de la photo 3" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_4.jpg" title="Titre de la photo 4"><img src="images\tata\black_flower_4.jpg" width="100" border="no" alt="Le titre de la photo 4" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_5.jpg" title="Titre de la photo 5"><img src="images\tata\black_flower_5.jpg" width="100" border="no" alt="Le titre de la photo 5" /></a></li>';
$contenu .= '</ul><dl id="photo"><dt>Titre de la photo 1</dt><dd><img id="big_pict" src="images\tata\black_flower_1.jpg" alt="Photo 1 en taille normale" /></dd></dl></div>';
Puis voici la partie du css:
div#galerie
{
width: 410px ;
background: #eed ;
border: 1px solid #dcb ;
padding: 15px ;
margin: 15px 30px ;
text-align: center ;
font: 0.9em Georgia, serif ;
}
ul#galerie_mini
{
text-align: center ;
margin: 10 ;
padding-right: 10 ;
list-style-type: none ;
}
ul#galerie_mini li
{
display : inline;
float: right ;
}
ul#galerie_mini li a img
{
margin: 2px 1px ;
border: 1px solid #dcb ;
}
Je n'y arrive pas le CSS.
Merci pour votre aide.
Je voudrais espacer les photos entres elles mais je n'y arrive pas. J'utilise le php afin de créer du dynamisme dans mes pages html.
Voici le script:
$contenu = '<div id="galerie"><ul id="galerie_mini">';
$contenu .= '<li><a href="images\tata\black_flower_1.jpg" title="Titre de la photo 1"><img src="images\tata\black_flower_1.jpg" width="100" border="no" alt="Le titre de la photo 1" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_2.jpg" title="Titre de la photo 2"><img src="images\tata\black_flower_2.jpg" width="100" border="no" alt="Le titre de la photo 2" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_3.jpg" title="Titre de la photo 3"><img src="images\tata\black_flower_3.jpg" width="100" border="no" alt="Le titre de la photo 3" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_4.jpg" title="Titre de la photo 4"><img src="images\tata\black_flower_4.jpg" width="100" border="no" alt="Le titre de la photo 4" /></a></li>';
$contenu .= '<li><a href="images\tata\black_flower_5.jpg" title="Titre de la photo 5"><img src="images\tata\black_flower_5.jpg" width="100" border="no" alt="Le titre de la photo 5" /></a></li>';
$contenu .= '</ul><dl id="photo"><dt>Titre de la photo 1</dt><dd><img id="big_pict" src="images\tata\black_flower_1.jpg" alt="Photo 1 en taille normale" /></dd></dl></div>';
Puis voici la partie du css:
div#galerie
{
width: 410px ;
background: #eed ;
border: 1px solid #dcb ;
padding: 15px ;
margin: 15px 30px ;
text-align: center ;
font: 0.9em Georgia, serif ;
}
ul#galerie_mini
{
text-align: center ;
margin: 10 ;
padding-right: 10 ;
list-style-type: none ;
}
ul#galerie_mini li
{
display : inline;
float: right ;
}
ul#galerie_mini li a img
{
margin: 2px 1px ;
border: 1px solid #dcb ;
}
Je n'y arrive pas le CSS.
Merci pour votre aide.
A voir également:
- Problème d'espace entre photo
- Espace insécable - Guide
- Google photo - Télécharger - Albums photo
- Espace de stockage gmail plein - Guide
- Photo filtre 7 gratuit - Télécharger - Retouche d'image
- Google maps photo maison - Guide
5 réponses
Théoriquement, il suffirait d'augmenter le margin des images pour les espacer... ou encore le padding des <li>.
Pour ça il faudrait changer le css de ta liste (<ul> et/ou <li>)... tes <li> devrait être en display:block et en float:left (de préférence, pour garder l'ordre correct).
Pourrais-tu nous montrer ta page pour de plus amples infos ?
Bon travail ! :D
Pourrais-tu nous montrer ta page pour de plus amples infos ?
Bon travail ! :D
je suis en local.
Mes photos sont l'une en dessous de l'autre et non à l'horizontale (ce que je voudrais).
Merci pour ton aide
Mes photos sont l'une en dessous de l'autre et non à l'horizontale (ce que je voudrais).
Merci pour ton aide
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question