[tableau alignement]

**trach.sam** · 29/04/2006, 00h57

bonjour,

j'utilise un tableau classique avec un tableau dynamique (un tableau ou l'on peut ajouter et supprimer des champs voir ici

le second ressemble à ca

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
 
<table class="dTable">
	<thead>
		<tr>
			<th>Colonne 1</th>
			<th>Colonne 2</th>
			<th>Colonne 3</th>
			<th>Colonne 4</th>
			<th>Actions</th>
		</tr>
	</thead>
 
	<tfoot>
		<tr>
			<th colspan="5"><a href="#">Ajouter une ligne</a></th>
		</tr>
	</tfoot>
 
	<tbody>
 
		<tr>
			<td><input type="text" name="champ1[]" /></td>
			<td><input type="text" name="champ2[]" /></td>
			<td><input type="text" name="champ3[]" /></td>
			<td><input type="text" name="champ4[]" /></td>
			<td><a href="#">Supp</a></td>
		</tr>
 
	</tbody>
</table>

le probleme c'est que les deux tableaux devrait être aligné, ce sont des tableau de champs de formulaire et que le second tableau ne semble pas suivre les regles classique, il n'obéit pas au width="134" ...
j'ai réussi au bout d'un long moment à aligné mais il suffit que je souhaite bouger un petit peu mon tableau pour que ca devienne une vrai mission et ca c'est pas possible.
savez vous comment aligner, "sizer" les tableaux comme ca ?

merci

**Swoög** · 29/04/2006, 10h23

Salut !

Pourrais-tu donner un exemple de la page avec les deux tableaux ?

Si tes deux tableaux ont le même nombre de colonnes et que les colonnes font les même largeurs, il n'y a pas de raison pour que tes deux tableaux ne soient alignés dans le même axe vertical..

**trach.sam** · 03/05/2006, 10h28

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
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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
<table width="815" height="76" border="0">
  <tr>
    <td width="19" height="21"  >&nbsp;</td>
    <td width="182"  >&nbsp;</td>
    <td colspan="2" align="center"  >Production</td>
    <td colspan="2" align="center"  >Homologation</td>
    <td colspan="2" align="center"  >Test</td>
    <td width="126"  >&nbsp;</td>
  </tr>
  <tr>
    <td height="21"  >&nbsp;</td>
    <td  >&nbsp;</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td  >&nbsp;</td>
  </tr>
  <tr>
    <td height="21"  >&nbsp;</td>
    <td  >Main OS </td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  >&nbsp;</td>
  </tr>
  </table>
<table width="815" class="dTable">
  <thead>
    <TR>
      <td width="19">&nbsp;</td>
      <td width="182">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="126">&nbsp;</td>
    </TR>
  </thead>
  <tfoot>
    <tr>
      <th colspan="9">&nbsp;</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>Authentication</td>
      <td><input name="toto1[]" type="text" id="toto1[]" size="15"></td>
      <td><input name="toto2[]" type="hidden" id="toto2[]" size="10"></td>
      <td><input name="toto3[]" type="text" id="toto3[]" size="15"></td>
      <td><input name="toto4[]" type="hidden" id="toto4[]" size="10"></td>
      <td><input name="toto5[]" type="text" id="toto5[]" size="15" ></td>
      <td><input name="toto6[]" type="hidden" id="toto6[]" size="10"></td>
      <td>&nbsp;</td>
    </tr>
 
  </tbody>
</table>
<table width="821" class="dTable">
  <thead>
    <TR>
      <td width="19">&nbsp;</td>
      <td width="113">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="102">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="105">&nbsp;</td>
      <td width="95">&nbsp;</td>
      <td width="99">&nbsp;</td>
      <td width="68">&nbsp;</td>
    </TR>
  </thead>
  <tfoot>
    <tr>
      <th colspan="9">&nbsp;</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>Authentication</td>
      <td><input name="toto1[]" type="text" id="toto1[]" size="15"></td>
      <td><input name="toto2[]" type="hidden" id="toto2[]" size="10"></td>
      <td><input name="toto3[]" type="text" id="toto3[]" size="15"></td>
      <td><input name="toto4[]" type="hidden" id="toto4[]" size="10"></td>
      <td><input name="toto5[]" type="text" id="toto5[]" size="15" ></td>
      <td><input name="toto6[]" type="hidden" id="toto6[]" size="10"></td>
      <td>&nbsp;</td>
    </tr>
 
  </tbody>
</table>

Je pense vous avoir concocté un bon exemple. Le premier tableau est le tableau momdele, le second est le tableau qui est censé ressemblé au premier. Le 3ieme est celui qui n'a rien à voir au premier pourtant il ressemble. Vous pouvez certainement vous dire c'est vrai c'est etrange mais bon maintenant il y a plus de probleme, Et ben si parce que si je modifie le premier tableau (le tableau modele) pour une raison quelquonque je passe un tmp fou à reproduire l'equivalent pour mes seconds tableaux.

Alors si vous avez une idée

merci

**Swoög** · 03/05/2006, 15h23

Je ne comprends pas très bien où est ton problèmes...

pourquoi ne pas tout simplement utiliser un seul tableau s'ils doivent être alignés ?

**trach.sam** · 04/05/2006, 10h51

je comprends ton interrogation!
l'idée c'est que les tableaux de class "dtable" sont en réalités des tableaux dynamiques (attaché à un javascript) permettant d'ajouter ou de supprimer des lignes comme ici
c'est pourquoi je sépare le tableau "fix" avec le tableau dynamique.

**blueice** · 04/05/2006, 10h59

Et comme ca :

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
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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
<table width="815" height="76" border="0">
  <tr>
    <td width="19" height="21"  >&nbsp;</td>
    <td width="182"  >&nbsp;</td>
    <td colspan="2" align="center"  >Production</td>
    <td colspan="2" align="center"  >Homologation</td>
    <td colspan="2" align="center"  >Test</td>
    <td width="126"  >&nbsp;</td>
  </tr>
  <tr>
    <td height="21"  >&nbsp;</td>
    <td  >&nbsp;</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td width="90"  >Name</td>
    <td width="60"  >Version</td>
    <td  >&nbsp;</td>
  </tr>
  <tr>
    <td height="21"  >&nbsp;</td>
    <td  >Main OS </td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="15" value=""></td>
    <td  ><input name="toto" type="text" id="toto" size="10" value=""></td>
    <td  >&nbsp;</td>
  </tr>
</table>
<table width="815" border="0" class="dTable">
  <thead>
    <TR>
      <td width="19">&nbsp;</td>
      <td width="182">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="60">&nbsp;</td>
      <td width="126">&nbsp;</td>
    </TR>
  </thead>
  <tfoot>
    <tr>
      <th colspan="9">&nbsp;</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>Authentication</td>
      <td><input name="toto1[]" type="text" id="toto1[]" size="15"></td>
      <td><input name="toto2[]" type="hidden" id="toto2[]" size="10"></td>
      <td><input name="toto3[]" type="text" id="toto3[]" size="15"></td>
      <td><input name="toto4[]" type="hidden" id="toto4[]" size="10"></td>
      <td><input name="toto5[]" type="text" id="toto5[]" size="15" ></td>
      <td><input name="toto6[]" type="hidden" id="toto6[]" size="10"></td>
      <td>&nbsp;</td>
    </tr>
 
  </tbody>
</table>
<table width="815" border="0" class="dTable">
  <thead>
    <TR>
      <td width="19">&nbsp;</td>
      <td width="113">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="102">&nbsp;</td>
      <td width="90">&nbsp;</td>
      <td width="105">&nbsp;</td>
      <td width="95">&nbsp;</td>
      <td width="99">&nbsp;</td>
      <td width="68">&nbsp;</td>
    </TR>
  </thead>
  <tfoot>
    <tr>
      <th colspan="9">&nbsp;</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>Authentication</td>
      <td><input name="toto1[]" type="text" id="toto1[]" size="15"></td>
      <td><input name="toto2[]" type="hidden" id="toto2[]" size="10"></td>
      <td><input name="toto3[]" type="text" id="toto3[]" size="15"></td>
      <td><input name="toto4[]" type="hidden" id="toto4[]" size="10"></td>
      <td><input name="toto5[]" type="text" id="toto5[]" size="15" ></td>
      <td><input name="toto6[]" type="hidden" id="toto6[]" size="10"></td>
      <td>&nbsp;</td>
    </tr>
 
  </tbody>
</table>

[tableau alignement]

HTML

Vue hybride

Discussions similaires

Partager

Partager