Discussion :

[aurelien.moutymbo]

Bonjour,

Je suis en train de creer un site internet et je souhaite afficher les elements de ma base de données sous forme de tableau.
Voici mon code:

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
42
43
44
45
46
47
48
<?php
			try
 
            {
 
            // On se connecte à MySQL
 
            $bdd = new PDO('mysql:host=localhost;dbname=alcool_pas_cher;charset=utf8', 'root', '');
			}
 
            catch(Exception $e)
 
            {
 
            // En cas d'erreur, on affiche un message et on arrête tout
 
            die('Erreur : '.$e->getMessage());
 
            }
            // On récupère tout le contenu de la table whisky
            $reponse = $bdd->query('SELECT * FROM spiritieux');
 
			?>
 
			<table>
 
 
			<?php
			//On affiche les lignes du tableau une à une à l'aide d'une boucle
            while ($donnees = $reponse->fetch())
            {
            ?>
 
 
 
					<td>
					<tr><img src="<?php echo $donnees['Photo']; ?>" alt="image" /></tr>
					<tr><?php echo $donnees['nom']; ?></tr>
					</td>
 
 
 
 
            <?php
            } //fin de la boucle, le tableau contient toute la BDD
            $reponse->closeCursor(); // Termine le traitement de la requête
            ?>
            </table>

J'obtiens les elements du tableau mais ma Photo et mon nom n'ont pas le meme alignement(voir pièce jointe)

[Invité]

Bonjour,

c'est un problème d'affichage, donc certainement de style CSS.
Pas de PHP.

Je te redirige vers le forum CSS.

Par contre, il faut que tu montres :

• le code HTML généré ("Ctrl" + "U") de la <table> créee
• le code CSS concerné

N.B. "A consommer avec modération".
(ou "avec un modérateur")

[aurelien.moutymbo]

Voici le code html de la table:

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<table>
 
 
 
 
 
					<td>
					<tr><img src="images/old_nick_40_70_cl.jpg" alt="image" /></tr>
					<tr><div>OLD NICK 40° 70 CL </div></tr>
					</td>
 
 
 
 
 </table>

et le code CSS concerné:

Code CSS :

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

1
2
3
4
5
6
7
table.div
 
{
	margin: auto;
    text-align: center;
 
}

[Invité]

Bonjour,

1- il faut apprendre la structure des <tables> HTML : Les tableaux (XHTML & CSS)

2- à lire aussi : Affichage de données dans un tableau HTML

3- alignement : supprime le <div>, ajoute les <td> manquants, et mets :

Code html :

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

1
2
3
4
   <tr>
      <td><img src="images/old_nick_40_70_cl.jpg" alt="image" /></td>
      <td>OLD NICK 40° 70 CL </td>
   </tr>

et en CSS :

Code css :

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

1
2
3
4
table td { 
    text-align:center; /* centrage horizontal */
    vertical-align:middle;  /* centrage vertical*/
}

[aurelien.moutymbo]

Bonjour jreaux62,

Le problème c'est que je souhaite afficher le nom en dessous de l'image.
Tandis que ta méthode affiche le nom à droite de l'image.

Merci d'avance de ta disponibilité.

[Invité]

Alors, il faut écrire :

Code html :

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

1
2
3
4
5
6
7
   <tr>
      <td>
            <img src="images/old_nick_40_70_cl.jpg" alt="image" />
            <br />
            OLD NICK 40° 70 CL 
      </td>
   </tr>

avec :

Code css :

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

table td { text-align:center; }

Cela dit : les <table> ne servent pas à la mise en page.
A moins d'afficher des données tabulaires, ce qui semble être le cas.

Si tu veux en mettre sur plusieurs par lignes / colonnes : regarde mon tuto ( = lien fourni précédemment).