Discussion :

[tigunn]

Salut a tou(te)s !

je suis en train de faire une page php affichant les données d'un tableau de gestion de projet.
Sur cette page je définit un tableau html similaire à un diagramme de Gantt.
ex:
projet A : de 01/01/2005 à 01/02/2005
va être représenté par un tableau qui aura en titre de ligne "projet A" et en titre de colonne les dates du 01/01 au 01/02 avec un pas de 7 jours.

Jusque là pas de problème, mais après je veux définir un style propre aux <td> de titre de colonnes et de lignes avec une css, et ca ne fait pas exactement ce que je veux, c'est-à-dire que dans l'example ci-dessous : les attributs de style sont tous pris en compte sauf width, pourquoi?
CSS

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
 
.titre_ligne{
	font-size:12px;
	font-weight:bold;
	color:#FFFFFF;
	background:#989DA5;
	border:1px solid #FFFFFF;
	width: 500px;
	height:40px;
}
 
.titre_colonne{
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	background:#989DA5;
	border:1px solid #FFFFFF;
 
}
 
.coin_tableau{
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	background:#989DA5;
	border:1px solid #FFFFFF;
 
}
 
.cellule_libre{
	font-size:12px;
	font-weight:normal;
	color:#000000;
	background:#FFFFFF;
	border:0px solid #FFFFFF;
}
 
.cellule_occupe{
	font-size:12px;
	font-weight:normal;
	color:#000000;
	background: #0080C0;
	border:0px solid #0080C0;
}

page php

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
 
	echo '<table id="tableau_general">';
 
	//afficher les fourchettes de temps
	echo '<tr>
		<td class="coin_tableau">&nbsp;</td>';
	for ($i=0;$i<count($fourchettes);$i++)
	{
		$temp=date('d/m/Y',$fourchettes[$i]);
 
		echo '<td title="Semaine du '.$temp.'" class="titre_colonne">';
		echo $temp;
		echo '</td>';
	}
	echo '</tr>';
 
	//afficher le contenu de $tab_gantt
	reset($tab_gantt);
	while ($row=next($tab_gantt)) 
	{
		echo '<tr>';
 
		echo '<td class="titre_ligne">'.$tab_nom_projet[$k].'</td>';
 
		foreach ($row as $key=>$elem)
		{
			if ($elem=='occupe')
			{
				echo '<td class="cellule_occupe">';
				echo '&nbsp;&nbsp;';
				echo '</td>';
			}
			else 
			{
				echo '<td class="cellule_libre">';
				echo '&nbsp;&nbsp;';
				echo '</td>';
			}
		}
 
		echo '</tr>';
 
		//incrementation de l'index sur $tab_nom_projet
		$k++;
	}
 
	echo '</table>';

Alors, comment puis-je faire pour appliquer une taille fixe à ma premiére colonne du tableau qui affiche le nom du projet?

[masu]

ca serai pratique que tu donne le code (html) d'un tableau generé par ton script php.

[masu]

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
<table id="tableau_general">
<tr>
	<td class="coin_tableau">&nbsp;</td>
	<td title="Semaine du 21/08/2006" class="titre_colonne">21/08/2006</td>
	<td title="Semaine du 28/08/2006" class="titre_colonne">28/08/2006</td>
	<td title="Semaine du 04/09/2006" class="titre_colonne">04/09/2006</td>
</tr>
 
<tr>
	<td class="titre_ligne">proj 1</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
	<td class="cellule_libre">&nbsp;&nbsp;</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
</tr>
<tr>
	<td class="titre_ligne">proj 2</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
	<td class="cellule_libre">&nbsp;&nbsp;</td>
</tr>
<tr>
	<td class="titre_ligne">proj 3</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
	<td class="cellule_libre">&nbsp;&nbsp;</td>
	<td class="cellule_occupe">&nbsp;&nbsp;</td>
</tr>
</table>

Avec ce code html, et ton css, les cases de projet font bien 500px de large comme indiqué dans le css.

Je ne comprend pas le probleme.

[tigunn]

voila un exemple du code généré :

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
 
<table id="tableau_general">
   <tr>
      <td class="coin_tableau">&nbsp;</td>
      <td title="Semaine du 12/06/2006" class="titre_colonne">12/06/2006</td>
      <td title="Semaine du 13/06/2006" class="titre_colonne">13/06/2006</td>
      <td title="Semaine du 14/06/2006" class="titre_colonne">14/06/2006</td>
   </tr>
   <tr>
      <td class="titre_ligne">Projet A</td>
      <td class="cellule_libre">&nbsp;&nbsp;</td>
      <td class="cellule_occupe">&nbsp;&nbsp;</td>
      <td class="cellule_occupe">&nbsp;&nbsp;</td>
   </tr>
</table>

alé alé, j'ai fait ça hier soir, et je pense qu'internet explorer n'avait pas rechargé ma css tout de suite...
du coup ce matin, ca marche, c'est beau .... l'étourderie.

Toutefois, width n'est plus un attribut valide W3C pour <td>, donc sous firefox les tailles des colonnes est fixe. Je cherche comment contourner ce problème....

et j'ai une réponse qui me convient autant qu'au W3C; j'utilise dans ma css : display: table; :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
.titre_ligne{
	font-size:11px;
	font-weight:bold;
	color:#FFFFFF;
	background:#989DA5;
	border:1px solid #FFFFFF;
	width: 250px;
	height:20px;
	padding-left: 10px;
	display: table;
}

nickel