Comment aligner les photos en php

Résolu
Bonsoir , j'aimerai savoir si l'un d'entre vous avez une astuce pour aligner des photos en php ?

Par exemple j'aimerai en aligner 3 sur une même ligne mais j'ai toujours un retour a la ligne.

Serai-ce à cause du foreach qui forme des blocs du coup ?

Merci , promis apres j'embete plus :p

Pour info mon code d'affichage ressemble à cela :
  <?php  foreach ($billets as $billet): ?>

<table><tr>
    <td nowrap="nowrap">  <a href="description.php?affiche=<?=$billet['id']?>">    <?php
            if($billet['photo']!=""){
            $photo = "uploads/".$billet['photo'];
            echo  "<img width='200px' height='150px' src='$photo'>";
            }
            ?></a></td>
</tr>
<tr><td nowrap="nowrap"><center><a href="description.php?affiche=<?=$billet['id']?>"> <h3><?= $billet['titre'] ?></h3></A></center></td></tr><tr>
<td nowrap="nowrap"><center><i><font color="grey"><h5><?= $billet['prix'] ?></h5></font></i></center></td></tr></table>

    <?php endforeach; ?>

2 réponses

  1. Modérateur
    Bonjour,

    aligner des photos en php ?

    Non ... pas en PHP ...

    Tout ce qui est affichage/mise en forme .. c'est côté HTML et CSS.
    Je déplace ton sujet dans le bon forum.

    1. Ah d'accord merci c'est gentil :3 !

      Du coup je ne sais pas comment faire la mise en forme a cause du foreach. Merci
    2. Modérateur
      @MalonTailsNon ce n'est pas " à cause " du foreach .....

      Dans ta boucle .. tu créés des TABLE (des tableaux html) pour chaque image ...
      Si tu veux en aligner 3 ... il faut donc que leur largeur ne dépasse pas le 1/3 de la zone ....
      et que le conteneur de ces tableaux soit en display : inline-block

      En gros
      <div id="conteneur">
          <table>
              <td><th>Image1</td></tr>
          </table>
          <table">
              <td><th>Image2</td></tr>
          <table>
          <table>
              <td><th>Image 3</td></tr>
          <table>
      </div>
      


      table {
          width: 30%;
          border: 2px solid black;
      }
      table{ 
          float: left; 
      }
      
       
      #conteneur {
          width:500px;
      margin:auto;
      }
      
    3. Merci beaucoup Jordane. Je suis au lit je testerai ça demain :3 je croise les doigts pour que ça marche :3
      Par contre je dois créer plusieurs table ? Car mes images viennent d'un appel php du coup je peu faire qu'une table non ?
      Désolée si mes questions paraissent bêtes :s
  2. Super ça marche merci ! Par contre mon tableau sort de mon div principal :s
     <div id="divMain">
          <h2><center>Articles disponibles en magasin </center></h2>
    
    
    <?php
    
        $bdd = new PDO('mysql:host=localhost; dbname=valflexibles; charset=utf8','root', '');
        if(isset($_GET['affiche']) AND !empty($_GET['affiche'])) {
          $affiche=(int) $_GET['affiche'];
        $req=$bdd->prepare('SELECT * from article where id = ?');
      $req->execute(array($affiche));
    
      } // fin de la fonction
       $billets = $bdd->query('select * from article
           order by id desc');?>
    
    
      <?php  foreach ($billets as $billet): ?>
    
    
    <table>
      <p><tr><td nowrap="nowrap">    <a href="description.php?affiche=<?=$billet['id']?>">    <?php
                if($billet['photo']!=""){
                $photo = "uploads/".$billet['photo'];
                echo  "<img width='200px' height='150px' src='$photo'>";
                }
                ?></a><p></th></td></tr>
    <tr><td nowrap="nowrap"><a href="description.php?affiche=<?=$billet['id']?>"> <h3><?= $billet['titre'] ?></h3></A></td></tr>
    <tr><td nowrap="nowrap"><i><font color="grey"><h5><?= $billet['prix'] ?></h5></font></i></td></tr></td>
    
    </table>
    
        <?php endforeach; ?>
    
    
    </div>

    #divMain {
      background-color:white;margin-left:auto;margin-right:auto;
      position:relative;width:900px;height:auto;top:60px;border-width:2px; border-style: solid;border-color: black;border-radius: 5px 10px 0 5px;
    }


    1. Ce pourrait-il que ça soit a cause du float- left ?
        table{
                float: left;
                margin-left: 30px;
                margin-top:50px;
            }
    2. Merci pour le lien il m'a permet de résoudre mon problème !