Bonjour,
J'ai un tableau de largeur 50%
table thead tr (dans le fichier css) fonctionne correctement car toute la largeur de l'entête du tableau est rouge.
Mais les th contenus dans ce tr ne couvrent pas toute la largeur du tableau.
Quelle propriété manque-t-il ?
Merci d'avance
HTML
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 <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Suivi</title> <link href="mystyles.css" rel="stylesheet" media="all" type="text/css"> </head> <body> <div> <table> <caption>Suivi</caption> <thead> <tr><th style="text-align:left;">Action</th><th>Personne</th><th>Date</th><th>Situation</th><th>Commentaire</th></tr> </thead> <tbody><tr><td>Rappel</td><td>Laurent</td><td>04/04/2017</td><td>En cours</td><td></td></tr></tbody> </table> </div> </body> </html>
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 select{ width:100%; height:100%; border:0; padding:0; margin:0; } input { width:100%; height:100%; border:0; padding:0; margin:0; } table { width:50%; table-layout: fixed; border-collapse: collapse; } table caption { font-size:1.4rem; color:#ffffff; background-color: #5d625c; /* caption-side: bottom; // top|bottom|initial|inherit; */ } table tbody { display: block; overflow: auto; width: 100%; height: 200px; overflow-y: scroll; overflow-x: hidden; } table thead tr { display: block; background-color:red; position: relative; width:100%; } table tbody tr:nth-child(odd) { background-color: #d6d3ce; border-bottom:1px solid #ccc; color:#444; } table tbody tr:nth-child(even) { background-color: #c6c3bd; border-bottom:1px solid #ccc; color:#444; } table tbody tr:hover:nth-child(odd) { background-color: #999690; color:#ffffff; cursor:pointer; } table tbody tr:hover:nth-child(even) { background-color: #999690; color:#ffffff; cursor:pointer; } table th { background-color:#999690; color:#fff; border:1px solid black; padding:0; margin:0; height:25px; } table tfoot td { color:#fff; background-color:#999690; border-top:1px solid #5d625c; border-bottom:1px solid #5d625c; } table td { border:1px solid black; } table td:nth-child(2) { text-align:center; } table td:nth-child(3) { text-align:center; } table td:nth-child(4) { text-align:center; }
Partager