Probleme Affichage dynamique

Répondre
Lefounard
le 02/08/2007 à 12:49
Lefounard
Déconnecté
I am singing in the rain , I am happy again !!
Bonjour,
Voila, j'ai fait une interface graphique pour afficher une liste d'elements.
Au debut en statique, l'affichage etait impecable, maintenant depuis que j'ai mis l'affichage des lignes dans une boucle while, tout est décalé !
  1.  
  2. /* CSS */
  3. .ligne_liste_produit{
  4.    border-style:dotted;
  5.    border-width:0px 0px 1px 0px;
  6.    padding:0.5em;
  7. }
  8.  
  9. .ligne_liste_produit a{
  10.    color:#000;
  11. }
  12.  
  13. .ligne_liste_produit a:hover{
  14.    color:grey;
  15.    text-decoration:none;
  16. }
  17.  
  18. .ligne_liste_produit img{
  19.    float:left;
  20.    margin:0.5em;
  21.    width:75px;
  22.    height:75px;
  23. }
  24.  
  25. .ligne_liste_produits_contenu{
  26.    margin-left:100px;
  27.    padding:1em;
  28. }
  29.  
  30.  
  31. <?php
  32. <div id="frame_liste_produits"> 
  33.                      <div id="titre_liste_produits"> 
  34.                         <span class="droite">               
  35.                            Trier par : 
  36.                            <select> 
  37.                               <option>Nom de produit : A à Z</option> 
  38.                               <option>Nom de produit: Z à A</option>   
  39.                            </select> 
  40.                         </span> 
  41.                         Liste Produits   
  42.                         <hr> 
  43.                      </div> 
  44.                      
  45.                      
  46.                      
  47.             <div class="ligne_liste_produit"> 
  48.                <img src="./photos/thumbs/mini_cam6.jpg" /> 
  49.                <div class="ligne_liste_produits_contenu"> 
  50.                <a href="#">Caméra dôme Anti vandale CPC 396</a><br /> 
  51.                Caméra dôme anti vandale Couleur Capteur Super HAD CCD 1/3" de Sony<br />
  52.                Haute résolution : 520 lignes<br />
  53.  
  54.                Luminosité : 1Lux / F2.0 ...<br />
  55.                </div>
  56.             </div>
  57.             <div class="ligne_liste_produit">
  58.                <img src="./photos/thumbs/mini_cam6.jpg" />
  59.                <div class="ligne_liste_produits_contenu">
  60.                <a href"#">Caméra Couleur Hte Résolution Outdoor CPC 383</a><br />
  61.                Caméra OUTDOOR Couleur Jour Nuit Haute Résolution avec capteur CCD 1/3"et DSP de Sony<br />
  62.  
  63.                Luminosité minimale : 0.25 Lux / F1.2; 0Lux / F1.2 avec IR allumée<br />
  64.                Nombre de pixels :<br />
  65.                768(H) x 494(V) PAL<br />
  66.                752(H) x 582 (V) NTSC<br />
  67.                </div>
  68.             </div>
  69.             <?php
  70. /* Affichage dynamique, tout se decale vers la droite !!! */            mysql_select_db('produits',LINK);
  71.                
  72.             $sql='SELECT nom, descriptif FROM produits_general WHERE id_cat_fk="'.$id_cat.'"';
  73.             $req=mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error());
  74.                
  75.             /* Si il y a des sous catégories, on les affiche */
  76.             if(mysql_num_rows($req)){
  77.                while($data= mysql_fetch_array($req))
  78.             {?>
  79.             <div class="ligne_liste_produit">
  80.                <img src="./photos/thumbs/mini_cam6.jpg" />
  81.                <div class="ligne_liste_produits_contenu">
  82.                <a href="#"><?php echo htmlentities(trim($data['nom']));?></a><br />
  83.                <?php echo nl2br(htmlentities(trim($data['descriptif']))); ?>
  84.                </div>
  85.             </div>
  86.                   <?php
  87.                   } 
  88.                } 
  89.                   
  90.                   
  91.                
  92.                ?>
  93.                   <div id="pages_liste_produits">
  94.                      <a href="#">1</a> -
  95.                      <a href="#">2</a>
  96.                   </div>
  97.                </div>
  98. ?>
  99.  


Merci de votre aide,
Ciao,
Bzh
le 02/08/2007 à 13:16
Bzh
Déconnecté
Il faut rajouter la propriété clear:both; !
Lefounard
le 02/08/2007 à 14:14
Lefounard
Déconnecté
I am singing in the rain , I am happy again !!
Merci ;)
Répondre
Accès rapide :

Remonter Remonter
L'éditeur javascript - CSS - Gentoo - Tutoriaux PHP - Tutoriels PHP - Php - Breizh Blog