Bonjour à tous!
Autrefois j'avais l'habitude d'organiser mes pages html grâce aux tableaux mais la tendance est plutôt aux div! J'essaie donc de m'y mettre mais je rencontre quelques difficultés à faire ma feuille css.
J'ai créé des div et chaque div contient des tableaux de données.
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
19 <div id="ampouleLocation"> <TABLE> <TR> <TH>Titre de tableau</TH> </TR> <TR> <TD CLASS="empty">Donnee du tableau</TD> <TD CLASS="full">Donnee du tableau</TD> </TR> </TABLE> </div> <div id="ampouleData"> <TABLE> <TR> <TD>Donnee du tableau</TD> </TR> </TABLE> </div>
Je souhaite styliser ces tableaux donc voici le css que j'ai créé :
Ce qui ne fonctionne pas : la mise en page du tableau (alors que la mise en page des cellules empty ou full fonctionne).
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 div#AmpouleLocation { float:left; width:250px; height:250px; background-color:#FFCC00; } .AmpouleLocation table { border-collapse: collapse; margin-top:2em; } .AmpouleLocation td{ font-family: sans-serif; font-style:italic; border: thin solid #6495ed; width: 20px; height:20px; padding: 5px; text-align: center; } td.empty{ background-color:green; font-weight:bold; } td.full{ background-color:red; } div#AmpouleData { height:250px; } .AmpouleData table { width:100%; margin-top:2em; border: medium solid #6495ed; border-collapse: collapse; } .AmpouleData th{ text-align:left; height:20px; font-family: monospace; border: thin solid #6495ed; width: 50%; padding: 5px; background-color: #D0E3FA; } .AmpouleData td{ height:20px; font-family: sans-serif; border: thin solid #6495ed; width: 50%; padding: 5px; text-align: center; background-color: #ffffff; }
Je pense que j'ai commis une erreur de syntaxe mais même en lisant plusieurs tutoriels, je n'arrive pas à savoir comment styliser un tableau à l'intérieur d'une div.
Si toutefois vous sauriez comment résoudre mon problème ou carrément mon conseiller une autre façon de faire plus correcte, je suis preneuse!
Merci d'avance!
Partager