Discussion :

[moimp]

Bonjour,

J'ai le tableau suivant:

Code html :

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
<table class="users">
	<caption>Tableau des droits utilisateurs</caption>
	<thead>
		<tr>
			<th rowspan="2" colspan="4"></th>
			<th colspan="19">Droits d'accès</th>
			<th rowspan="2" colspan="2" class="thGrpAction">Actions</th>
		</tr>
		<tr>
			<th colspan="2" class="thGrpOnglets">sur les réglages</th>
			<th colspan="12" class="thGrpOnglets">sur le fichier</th>
			<th colspan="5" class="thGrpOnglets">sur export et impressions</th>
		</tr>
		<tr><th>Code d'accès</th><th>Autorisation</th><th>Banni</th><th>Mise à jour</th><th>Autoris. masquage</th><th>Impressions</th><th>Création personnel</th><th>Modif. personnel</th><th>Suppression personnel</th><th>Création activités</th><th>Modif. activités</th><th>Suppression activités</th><th>Création compétences</th><th>Modif. compétences</th><th>Suppression compétences</th><th>Création groupes</th><th>Edition groupes</th><th>Suppression groupes</th><th>Messagerie</th><th>Etiquettes std</th><th>Badges</th><th>Export VCF</th><th>Export CSV</th><th>Edition ligne</th><th>Suppression ligne</th></tr>
	</thead>
	<tbody>
	</tbody>
</table>

J'ai deux problèmes:
1-Je n'arrive pas à régler au minimum la largeur des cellules verticales,
2-Le fond des cellules verticales est irrégulier. Il n'occupe pas partout toute la hauteur mais si je me mets en déboggage (F12) les cellules occupent alors leur hauteur. Voir image.



Voici le CSS:

Code css :

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
.users
{
	text-align:center;
	font-size:10px;
}
.users caption
{
	padding:10px;
	font-size:14pt;
}
.users thead tr:nth-child(3) {
	height:105px;
}
.users thead tr:nth-child(3) th {
	background-color:transparent;
	padding:0;
	margin:0;
	height:105px;
	width:0;
	height:0;
	/* Safari */
	-webkit-transform: rotate(-90deg);
	/* Firefox */
	-moz-transform: rotate(-90deg);
	/* IE */
	-ms-transform: rotate(-90deg);
	/* Opera */
	-o-transform: rotate(-90deg);
	/* Internet Explorer */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

EDIT: Si je mets un fond opaque, j'obtiens un gros rectangle horizontal qui déborde sur les cellules voisines.