Bonjour
Pouvez vous m'aider à trouver mon erreur svp.
Je crée un lien dans une page (au milieu) et tout le reste de la page agit comme lien voici mon code html et mon code css
Merci à l'avance
code 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
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 html <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="design_acuq.css" /> <title>Site de l'ACUQ</title> </head> <body> <div id="en_tete"> <!-- Ici on mettra la bannière --> </div> <div id="menu"> <!-- Ici on mettra le menu --> <div class="element_menu"> <!-- Cadre correspondant à un sous-menu --> <!-- ici on pourrait placer le titre du menu --> <!-- ici on pourrait placerles balises H? pour la grosseur des caracteres --> <ul> <br /> <li class="puce"><a href="nouvelles2.htm">Salle des nouvelles</a></li> <li class="puce"><a href="ca2.htm">Conseil d'administration</a></li> <li class="puce"><a href="congres2.htm">Congrès</a></li> <li class="puce"><a href="membre2.htm">Devenir membre</a></li> <li class="puce"><a href="reglements2.htm">Règlements</a></li> <li class="puce"><a href="presse2.htm">Salle de presse</a></li> <li class="puce"><a href="liens2.htm">Liens utiles</a></li> <li class="puce"><a href="joindre2.htm">Nous joindre</a></li> <li class="puce"><a href="/forum/index.php">Forum de discussion</a></li> </ul> </div> </div> </div> <div id="corps"> <!-- Ici on mettra le contenu principal de la page (tout le texte quoi) --> <h1>Devenir membre</h1> <p> Pour devenir membre de l'Association des Centres d'Urgence 9-1-1 du Québec, il suffit d'imprimer et de compléter le*formulaire en cliquant sur le lien ci-dessous et de le retourner avec votre paiement à l'adresse mentionnée au bas du formulaire. </p> <h3> <center><a href=" ../htdocs/avis abonnement-renouvellement ACUQ 911 2009-2010.doc" class="liendoc"><em>Abonnement-Renouvellement ACUQ 9-1-1 2009-2010</em> </center></h3> <br /> <h2>Le Conseil d'administration</h2> <p>Le conseil d'administration est constitué d'un président, un vice-président, un trésorier, un <br /> secrétaire et cinq administrateurs. Une personne peut cumuler deux fonctions.</p> <p>Selon les règlements de l'association, seul les membres actifs peuvent poser leur candidature sur un poste du conseil d'administration</p> </div> </div> <div id="pied_de_page"> <!-- Enfin, on mettra en bas de la page le nom de l'auteur, un copyright... --> <p>Copyright 2008 "ACUQ 9-1-1" tous droits réservés</p> </div> </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
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 css @charset "utf-8"; /* CSS Document */ body { width: 760px; margin: auto; /* Pour centrer notre page */ margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */ margin-bottom: 20px; /* Idem pour le bas du navigateur */ background-color: #8B0000; /* fond rouge */ } /* L'en-tête */ #en_tete { width: 760px; height: 130px; background-color: #ffffff; /* fond rouge */ background-position:center center ; background-image: url(/images/logo_acuq.jpg); background-repeat: no-repeat; margin-bottom: 10px; border-top-style: none; border-top-color: #99FF00; margin-left:0px; } /* Le menu */ #menu { float: left; width: 180px; height: 400px; } .element_menu { background-color: #3333cc; background-repeat: no-repeat; border: 2px solid black; margin-bottom: 20px; } /* Quelques effets sur les menus */ .element_menu h3 /* Tous les titres de menus */ { color: #B3B3B3; font-family: Arial, "Arial Black", "Times New Roman", Times, serif; text-align: center; } .element_menu ul /* Toutes les listes à puces se trouvant dans un menu */ { list-style-image: url("images/puce.png"); /* On change l'apparence des puces */ padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */ padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */ margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */ margin-bottom: 18px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */ } .puce { margin-top: 18px; } .element_menu a /* Tous les liens se trouvant dans un menu */ { color: #ffffff; } .element_menu a:visited { color: #ffffff; } .element_menu a:hover /* Quand on pointe sur un lien du menu */ { background-color: #3333FF; color: black; } /* Le corps de la page */ #corps { margin-left: 190px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */ margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */ min-height: 375px; padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */ color: #FFFFFF; background-color: #3333cc; /* fond bleu */ background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */ border: 2px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */ position: relative; } a.liendoc { color;#ffffff } a.liendoc:visited { color:#ffffff } /* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */ #pied_de_page { padding: 10px; margin-left: 190px; text-align: center; margin-top: 15px; color: #ffffff; background-color: #3333cc; background-repeat: no-repeat; border: 2px solid black; }
Partager