Répartition de TD dans une table

**zooffy** · 21/06/2016, 14h44

Bonjour àtous.

je viens vers vous car il y a un détail que je ne capte pas dans les ColSpan dans le Table.
Je voudrais faire un tableau avec trois cellules sur une ligne et deux sur la ligne d'en-dessous réparti en quinconce
J'ai tenté de jouer avec les ColSpan pour faire ma répartition en mettant quatre cellules sur al première ligne avec un ColSpan=2 sur les deux cellules du milieu et toutes les cellules en Colspan=2 sur la ligne en-dessous mais ça fait pas ce que je veux : la troisième cellule du le première ligne est plus large que ce qu'il faut. Voici mon code :

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<style type="text/css" media="all">
.tdDouble {
    max-width:300px;
    width:300px;
    text-align:center;
}
.tdSimple {
    max-width:150px;
    width:150px;
    text-align:center;
}
</style>
</head>
 
<body>
<table border="1" style="width:900px;">
<tr>
<td class="tdSimple"></td>
<td colspan="2" class="tdDouble"><img src="http://esport.ozouf.com/PersoRotation/Perso41.png" /></td>
<td colspan="2" class="tdDouble"><img src="http://esport.ozouf.com/PersoRotation/Perso41.png" /></td>
<td class="tdSimple"></td>
</tr>
<tr>
<td colspan="2" class="tdDouble"><img src="http://esport.ozouf.com/PersoRotation/Perso41.png" /></td>
<td colspan="2" class="tdDouble"><img src="http://esport.ozouf.com/PersoRotation/Perso41.png" /></td>
<td colspan="2" class="tdDouble"><img src="http://esport.ozouf.com/PersoRotation/Perso41.png" /></td>
</tr>
</table>

Si vous aviez deux minutes pour me dire où je me plante, sachant que je tiens à utiliser une Table et que je ne veux pas utiliser de Div ?

Merci et bonne journée.

**EddiGordo** · 21/06/2016, 15h37

Bonjour,

Ta demande : une table avec des lignes de 3 cellules, puis de 2 cellules alternativement, et disposition de ces cellules en quinconce.

Pour faire ça il faut avoir une table avec 2x3 = six colonnes.
Les cellules des lignes paires en colspan 2 : trois cellules en tout
Les cellules des lignes impaires en colspan 3 : deux cellules en tout

Exemple :

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
<tr>
                <td colspan="2">1</td>
                <td colspan="2">2</td>
                <td colspan="2">3</td>
            </tr>
            <tr>
                <td colspan="3">1</td>
                <td colspan="3">2</td>
            </tr>
            <tr>
                <td colspan="2">1</td>
                <td colspan="2">2</td>
                <td colspan="2">3</td>
            </tr>
            <tr>
                <td colspan="3">1</td>
                <td colspan="3">2</td>
            </tr>

**zooffy** · 21/06/2016, 16h00

Comment on dit dans la vie ? Pourquoi faire simple quand on peut faire compliqué !!!

Merci pour ton aide, je suis un gros noobard sur ce coup là. Peut-être que j'ai oublié de mettre mon cerveau en marche ce matin.

Vraiment merci pour ta patience.
Je te souhaite une excellente journée.

Répartition de TD dans une table

HTML

Vue hybride

Discussions similaires

Partager

Partager