[CSS] Tableau dépasse de la div
Bonjour à tous.
J'ai une div globale qui inclue 3 autres div (une à droite, une au centre et une à gauche). Dans la div de droite j'affiche un tableau avec des mots assez long dans ses cellules. Mon problème est que le tableau dépasse de la div de droite et aussi de celle globale. Or je voudrais que la div globale et la div de droite s'agrandissent automatiquement avec la div de droite. Je gère le tout avec un css.
Voici le code du fichier 'index.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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>
Page de test
</title>
<meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />
<link href="./style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="page">
<div id="div_menuGauche_texte">
<!-- Menu de gauche -->
<div id="menuGauche">
<ul>
<li>
viroehv
</li>
<li>
viroe
</li>
<li>
viroehvi
</li>
</ul>
</div> <!-- menuGauche -->
<div>
</div>
<!-- Corps du texte de la page -->
<div id="texte">
<table>
<tr class="titre">
<td>
tototot
</td>
<td>
gvrfeee
</td>
<td>
Coucouu
</td>
<td>
Descriptif
</td>
<td>
ole
</td>
</tr>
<tr>
<td>
youuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu
</td>
<td>
crevrevreveriurvebviujhrebvikjhbrevjkreje
</td>
<td>
cnrezovoiurhevniorhnevolkrevopre
</td>
<td>
vnreivhjiore crezvre cez cfezcezcezvc cezcze cfez cez cez c ezcezcezcez cez cez cez cez cez cez cez cez
</td>
<td>
vfrziofvrhzorenilkrezhjnbikmvrevrelrenhgviklrenigvolreiovlkr
</td>
</tr>
</table>
</div> <!-- texte -->
</div> <!-- div_menuGauche_texte -->
</div> <!-- page -->
</body>
</html> |
Voici le code du fichier 'style.css':
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
| table{
margin-top:1em;
background-color:#fff;
color:#655f4b;;
}
table,td{
border-collapse:collapse;
border:1px solid #a2c2e1;
padding:0.2em;
}
/* Page globale */
#page{
background-color:#fff;
color:#655f4b;
border:2px solid #000;
}
/* Div du menu de gauche et de la zone de texte (conteneur) */
#div_menuGauche_texte{
width:100%
margin-top:1%;
margin-bottom:1%;
margin-right:1%;
margin-left:1%;
}
/* Menu de gauche (contenu) */
#menuGauche{
float:left;
width:17%;
margin-right:3%;
border-style:solid;
}
/* Corps du texte de la page (contenu) */
#texte{
width:83%;
margin-left:20%;
padding:1% 1% 1% 1%;
color:#655f4b;
background-color:#f5f8fc;
border:1px solid #69c;
} |
Merci d'avance de vos réponses.
