Non alignement de tableaux malgré l'attribut style="width:100%"
Bonjour
Je ne comprends pas pourquoi le tableau contenu dans
Code:
<div id="objet" style="width: 100%;">
n'est pas aligné avec deux les tableaux du dessus.
Sans doute, cela provient-t-il du fait que les deux tableaux du dessus contenus dans
Code:
<table class="class_table_image">
ne démarrent pas exactement à gauche de la page et ne se terminent pas exactement à droite de la page.
Voici les fichiers:
Code:
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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
| <!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="anomaly.css">
<title>Rapport</title>
</head>
<body>
<div id="contenu" style="width:100%">
<table class="class_table_image" style="width:100%">
<tr>
<td class = "class_second_column">
<table style="width:100%" class="class_border class_table_in_table_image">
<thead>
<tr>
<td style="width:60%" class="class_border">Appelant / Locataire</td>
<td style="width:40%" class="class_border">Appel</td>
</tr>
</thead>
<tr>
<td style="width:60%" class="class_border">Kevin Berthier</td>
<td style="width:40%" class="class_border"> 19 Décembre 2022 09:20<br> </td>
</tr>
</table>
</td>
</tr>
</table>
<table class="class_table_image" style="width:100%">
<tr>
<td class = "class_second_column">
<table style="width:100%" class="class_border class_table_in_table_image">
<thead>
<tr>
<td style="width:50%" class="class_border">Localisation</td>
<td style="width:25%" class="class_border">Métier</td>
<td style="width:25%" class="class_border">Date prévue</td>
</tr>
</thead>
<tr>
<td style="width:50%" class="class_border">
En lorraine<br>
1731-0008<br>
</td>
<td style="width:25%" class="class_border">
Essais
</td>
<td style="width:25%" class="class_border">
<div class="class_cell_fixed_width">
20 Décembre 2022 12:22<br>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<div id="etat_demande" style="width: 100%;">
<!---->
État de la demande : Nouveau
<br>
Catégorie de la demande : Sécurité
</div>
<div id="objet" style="width: 100%;">
<table class="class_border" style="width: 100%;">
<tr>
<td >
Objet : Anomalie
<br>
Demande N° : CRA-695245-123788
<br>
Urgence :
Urgent
</td>
</tr>
</table>
</div>
<div id="compte_rendu" style="width: 100%;">
<table class="class_border_bottom">
<tr>
<td>
<b>Compte-rendu d'anomalie N° 208559</b>
</td>
</tr>
</table>
</div>
<div id="detail_cr" style="width: 100%;">
<table class="class_border">
<tr>
<td>
Commentaires : OK
<br>
Origine : 208559/001
<br>
Technicien : Gérard Tellier
</tr>
</table>
<br>
</div>
<br>
<br>
<br>
<br>
</div>
</body>
</html> |
Code:
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
| div#contenu {
float:left;
height:400px;
background-color:#FFFFFF;
}
div#logo {
float:left;
background-color:#FFFFFF;
}
div#logo_bottom {
float:centered;
background-color:#FFFFFF;
}
div#etat_demande {
float:left;
background-color:#FFFFFF;
text-align: left;
}
div#objet {
float:left;
background-color:#FFFFFF;
text-align: left;
}
div#compte_rendu {
float:left;
background-color:#FFFFFF;
text-align: left;
}
div#detail_cr {
float:left;
background-color:#FFFFFF;
text-align: left;
}
thead{
background-color: #696969;
color:black;
}
.class_border {
border: 1px solid #333;
word-break: break-word;
}
.class_border_bottom {
border-bottom: 1px solid #000;
}
.class_all_borders {
border-top: thin solid black;
border-bottom: thin solid black;
border-left: thin solid black;
border-right: thin solid black;
}
.class_table_image {
table-layout: fixed;
width: 600
}
.class_first_column {
width: 90
}
.class_second_column {
width: 510
}
.class_table_in_table_image {
table-layout: fixed;
} |
