Discussion :

[Maf77]

Bonsoir à vous

Je voudrais savoir pourquoi cela ne fonctionne pas:

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
<table width="60">
	<tr>
		<td>
			<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
		</td>
		<td>
			<img src="image/produit/sabots/sabots dorés brillant.jpg" width=200 height=150>
		</td>
		<td>
			<img src="image/produit/sabots/sabots grisés brillant.jpg" width=200 height=150>
		</td>
		<th>
			<img src="image/produit/sabots/sabots maron authentique.jpg" width=200 height=150>
		</th>
		<th>
			<img src="image/produit/sabots/sabots maron clair normal.jpg" width=200 height=150>
		</th>
		<th>
			<img src="image/produit/sabots/sabots maron normal.jpg" width=200 height=150>
		</th>
	</tr>
		<th>
			sabots blanc brillant
		</th>
		<th>
			sabots dorés brillant
		</th>
		<th>
			sabots grisés brillant
		</th>
		<th>
			sabots maron authentique
		</th>
		<th>
			sabots maron clair normal
		</th>
		<th>
			sabots maron normal
		</th>
	<tr>
	</tr>
<table>

Je comprend pas pourquoi sa déborde totalement de l'espace que je lui spécifie dans l'attribut table.

Aussi, comment faire ceci dynamiquement?

Merci

[KristoV]

Bizarrement, je crois que je vois pas trop ce que tu veux dire.

Mais est-ce que tu pourrais essayer de mettre des unités derrière tes chiffres. Par exemple, ta table, elle a une largeur de 60, ok, mais 60 quoi ? %, pixels, em ? Précise lui tout ça, tu verras que ça ira déjà beaucoup mieux.

Concernant ce que tu veux faire, ce ne serait pas, par hasard, plutôt de mettre les boîtes les unes après les autres et qu'elles aillent à la ligne toutes seules au besoin ?

[Maf77]

Merci de ton intêret KristoV
L'attribut width dans une table est à indiqué simplement,e t interprété en pourcentage cf ici

Ce que je veux faire c'est une image, une description en dessous pour le moment en ignorant le nombre d'image, sa doit être contenu dans mon corps de page.
Un exemple plus concret ici

[KristoV]

Je pense que si tu spécifie les longueurs de tes cellules de tableau, il est logique que ton tableau de 60% de long dépasse au bout d'un moment.

Étant donné que je me sens d'humeur charitable, je vais t'expliquer un peu plus loin .

Déjà, ton code est loin d'être juste, il faut faire attention quand tu écris les balises. Regarde tes <tr>, tu ouvres, tu mets des cellules, tu fermes puis... tu oublies de l'ouvrir avant de mettre des cellules puis tu ouvres et tu fermes... non, tu devrais plutôt écrire :

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
23
24
25
26
27
28
29
30
31
 
<table width="70%" border="1">
	<tr>
		<td>
			<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
		</td>
		<td>
			<img src="image/produit/sabots/sabots dorés brillant.jpg" width=200 height=150>
		</td>
		<td>
			<img src="image/produit/sabots/sabots grisés brillant.jpg" width=200 height=150>
		</td>
		<td>
			<img src="image/produit/sabots/sabots maron authentique.jpg" width=200 height=150>
		</td>
	</tr>
	<tr>
		<td>
			sabots blanc brillant
		</td>
		<td>
			sabots dorés brillant
		</td>
		<td>
			sabots grisés brillant
		</td>
		<td>
			sabots maron authentique
		</td>
	</tr>
<table>

Là, je pense qu'en plus, si tu copies et colles ce code dans un fichier html, tu peux voir que la table a bien la taille voulue (70%) et que les cellules ne dépassent pas. Par contre, si j'en ajoute une ou deux, le tableau devra faire plus que 70% de la largeur de la page pour contenir toutes tes cellules et donc, il s'élargira. (au passage, il faut ajouter le % pour que ça marche bien )

Ensuite, je ne vois aucune réelle raison d'utiliser un tableau pour ce genre de chose alors que tu pourrais utiliser des boîtes div.

Je te donne un exemple vite fait :

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
 
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
 
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>
<div style="float: left; width: 200px; text-align: center; border: 1px solid black; height: 170px; margin-right: 10px; margin-bottom: 10px;">
	<img src="image/produit/sabots/sabots blanc brillant.jpg" width=200 height=150>
	sabots blancs brillants
</div>

Bon, c'est long parce que je n'ai pas défini de style global mais c'est visuellement plus attractif, me semble-t-il et, de surcroît, ça permet de redimensionner la fenêtre sans avoir de scrollbar horizontale.

Sur ce... bonne cogitation !

[Maf77]

Wow!!
Je suis impréssioné!
Merci beaucoup de ton aide KristoV!
C'est super, ca marche très bien, merci!!!

[KristoV]

Oh ben de rien, n'hésite pas à me montrer tout ça une fois que ça sera fini ^^