[HTML] alignement par 3 ,des images

Version imprimable

21/09/2006, 10h57
oceane751

[HTML] alignement par 3 ,des images

bonjour à tous!!

j'aimerais pouvoir aligner horizontalement et par 3, des images d'une BDD mais je ne sais pas comment faire
par exple si j'ai 9 images, je voudrais 3 lignes de 3 images

au lieu de ça, mon code m'affiche les images en colonne (j'ai 3 images = ca me donne une colonne et 3 lignes)

si quelqu'un pourrait m'aider se serait tres gentil

merci ebaucoup!!
21/09/2006, 11h12
blueice

Ok mais tu codes comment ?
Avec des tableaux, sans tableau, en xhtml, transitionnel ou strict ?
21/09/2006, 13h54
oceane751

arf pardon
en html et avec tableau ;)
21/09/2006, 14h40
blueice

Tu indiques que tu extraits les données d'une BDD, il te suffit de faire un tableau de 3 colonnes par X lignes.... 8O

Salut

T'as pas un bout de code à proposer oceane ? Tu travail avec php ? Car il existe de nombreuses possibilités. Sous quelle forme sont stockés les chemin de images, comment les extrais-tu ?

Ton code de sortie, une fois généré par le langage coté serveur que tu utilises, doit ressembler à ceci :

Code:

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
<table>
  <tr><!-- 1ère ligne -->
    <td><img src="image1.jpg" alt="mon image 1"></td><!-- 1ère colonne -->
    <td><img src="image2.jpg" alt="mon image 2"></td><!-- 2ème colonne -->
    <td><img src="image3.jpg" alt="mon image 3"></td><!-- 3ème colonne -->
  </tr>
  <tr><!-- 2ème ligne -->
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
  </tr>
  <tr>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
  </tr>
  <tr>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
  </tr>
  <tr><!-- 5eme ligne -->
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
    <td><img src="" alt=""></td>
  </tr>
</table>

...
je fais un boucle
voici le code :

Code:

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
 
 
<?
.....
$sql = "SELECT image, designation_produit, prix_produit FROM produit WHERE type_produit = 'ordinateur de bureau'";
$m = mysql_query($sql);
 
 
 
 
while ($fe = mysql_fetch_array($m))
{
echo" <table border = '1'>";
echo "<form method = 'POST' action = detail.php>";
extract($fe);
echo "<tr><td>
<input type = hidden name = 'article' value = \"".$desi."\">
<a href= \"#\" onclick= ImageMax(\"http://127.0.0.1/oceanecoin/PHOTOSITEINFO/",$image,"\");>
<img src= http://127.0.0.1/oceanecoin/PHOTOSITEINFO/",$image," width=\"213\" height=\"180\" border=\"0\" hspace=\"40\" Hspace=10 ></a>";
 
 
 
 
echo"<p><center>".$fe[1]."</p>
<p><font color = red><b>".$fe[2]."€</font></b></p>
 
 <input type = submit value = detail name = detail>
</td></tr>";
echo" </table>";
echo"</form>";
}
 
 
echo"<br>
</html> ";
 
?>

:roll:

23/09/2006, 13h55
ilood

Ton

Code:

echo" <table border = '1'>";echo "<form method = 'POST' action = detail.php>";

est mal placé, il ne devrait pas se situer dans la boucle while.
Regarde le code html généré, tu t'apercevras que tu as un tableau pour chaque ligne de résultat.

Enfin tu dois introduire une autre boucle pour faire tes 3 colonnes.

Il y a d'autres choses à voir, mais là on rentre dans le domaine du php :)
24/09/2006, 00h13
oceane751

ouais je sais que j'ai 3 tableaux vue que je boucle..
mais bon je vais aller voir sur le forum php

merci pour les réposnes
24/09/2006, 11h05
fallais

Algorithe simple :

Tu definis une varibale $count = 1;

Si $count <= 3 ALORS je remet un <td> et $count+1=$count;
SINON je met un <tr> et je remet la variable $count à 1

ah aousi dacor
j'ia une connaissance qui m'a donné un petit truc dans le genre de ce que tu m'as proposé
mais bon j'ai pas trop pigé la logique donc ça marche pas..

Code:

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?


echo "
<html><center>ordinateur|imprimante</center>";
//<HR width=100%>
echo"<center>";

include ("definitioninfo.php");
session_start();
$base=mysql_connect("localhost","root","oui");
 mysql_select_db("bd", $base);





$sql = "SELECT  image, ref_produit, designation_produit, prix_produit FROM produit WHERE type_produit = 'ordinateur de bureau'";
$m = mysql_query($sql);




while ($fe = mysql_fetch_array($m))
{

$col =0;
$cols = 3; 


echo" <table border = '1'>";
echo "<form method = 'POST' action = detail.php>";
extract($fe);

  $col = $col+1; 

echo"
<br<<br><br> ";

 $desi = $fe[2];
if ($col%$cols ==1) {
  echo "<tr>";
}
echo $fe[1]."<br>";


//echo $desi;


echo"<td>
<input type = hidden name = 'ref' value = \"".$fe[1]."\">
<input type = hidden name = 'article' value = \"".$desi."\">
<a href= \"#\" onclick= ImageMax(\"http://127.0.0.1/oceanecoin/PHOTOSITEINFO/",$image,"\");>
<img src= http://127.0.0.1/oceanecoin/PHOTOSITEINFO/",$image," width=\"213\" height=\"180\" border=\"0\" hspace=\"40\" Hspace=10 ></a>";




echo"<p><center>".$fe[2]."</p>
<p><font color = red><b>".$fe[3]."€</font></b></p>

 <input type = submit value = detail name = detail>
</td></tr>";


if ($col%$cols ==0) 
{
echo" </table>";
}


 echo"</form>";
}


echo"<br>
</html> ";

?>