Mise en forme d'images récupérées dans une base de données en PHP

**nekcorp** · 24/09/2014, 13h08

Bonjour à tous,

Je récupère des images dans une base de donnée avec du PHP, pour les afficher sur ma page html. Jusqu'ici pas de soucis.

Mon problème vient quand je veux appliquer du CSS sur mes balises <figure> <img> et <figcaption>

Pour l'instant le code afficher les images les unes en dessous des autres avec leur titre respective.
Je souhaite les afficher les unes à coté des autres et éventuellement en mettre à la ligne pour former une grille.

Voici le HTML et le CSS

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta http-equiv="Content-Language" content="fr" />
 <title></title>
 <link rel="stylesheet" type="text/css" href="style.css" media="all" />
</head>
<body>
<?php
// on se connecte à MySQL 
$db = mysql_connect('localhost', 'root', 'root'); 
 
// on sélectionne la base 
mysql_select_db('Data_Movie',$db);
 
//Requête SQL
//$requete='SELECT Link_Poster FROM Data';
$requete='SELECT Title, Link_Poster FROM Data';
$exec=mysql_query($requete);
 
//Boucler sur chaque lien de la colonne Link_Poster
//While($ligne=mysql_fetch_array($exec)) 
While($ligne=mysql_fetch_assoc($exec)) {
 
?>
<figure>
<?php echo '<img alt="" src=" '.$ligne['Link_Poster'].' "border="0" /> '; ?>
<figcaption> <?php echo $ligne['Title'] ;?> </figcaption>
</figure>
 
<?php
 
}
 
//Fermeture de MySQL
mysql_close();
?>
</body>
</html>

Le CSS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
body {
	background: #fff;
  	margin : 0;
  	padding : 0;
  	height : 100%;
}
.contenu figure {
	margin-right: 35px;
	float: left;
}
 
.contenu img {
	width: 150px;
	height: 200px;
}
 
.contenu figcaption {
     text-align: left;
     color: white;
     font-size: 0.8em;
     font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
}

Merci d'avance pour votre aide

**black-hawk-down** · 24/09/2014, 13h43

Salut,

.contenu n'est jamais définie dans ton HTML, ceci expliquant cela. Ton sélecteur n'est pas bon. Soit tu rajoutes une section, div, ou n'importe quel conteneur valable, soit tu vires le .contenu de tes sélecteurs. Au choix.

**nekcorp** · 24/09/2014, 16h35

Envoyé par black-hawk-down

Salut,

.contenu n'est jamais définie dans ton HTML, ceci expliquant cela. Ton sélecteur n'est pas bon. Soit tu rajoutes une section, div, ou n'importe quel conteneur valable, soit tu vires le .contenu de tes sélecteurs. Au choix.

Honte à moi

problème résolu en ajoutant un <div id="contenu"> ........... </div>

encore merci

Mise en forme d'images récupérées dans une base de données en PHP

CSS

Discussions similaires

Partager

Partager