pblm d'affichage de mon menu
Bonjour à tous
Voilà, je viens de creer un menu en partie repris sur un site mais je n'arrive pas à obtenir exactement ce que je veux. Je m'explique :
Sous firefox 2.0.0.3 j'ai une barre horizontale alors que je voudrais qu'il ne prenne que la totalité de la page et de plus mon menu home n'apparait pas.
Voici donc le code de la page:
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
| <body>
<div id="header">
<div id="logo">
<a href="menu.html" title="home"><img src="ressources/images/logoanim.gif" alt="logo"/img>
</div>
<!-- Menu principal -->
<div id="navbar">
<ul class="nav_menu_haut">
<li><a href="#" title="back to homesite">Home</a></li>
<ul>
<li><a href="#" title="Sign in">Sign in</a></li>
<li><a href="#" title="Personnalize my account">My eStock</a></li>
<li><a href="#" title="Become a member">Subscribe</a></li>
</ul>
<li><a href="#" title=" ">Menu2</a>
<ul>
<li><a href="#" title=" ">Sous menu 2.1</a></li>
<li><a href="#" title=" ">Sous menu 2.2</a></li>
</ul>
</li>
<li><a href="#" title=" ">Menu3</a>
<ul>
<li><a href="#" title=" ">Sous menu 3.1</a></li>
<li><a href="#" title=" ">Sous menu 3.2</a></li>
<li><a href="#" title=" ">Sous menu 3.3</a></li>
</ul>
</li>
<li><a href="#" title="forum">forum</a></li>
<li><a href="#" >Search</a></li>
<li><a href="#" title=" ">menu6</a>
<ul>
<li><a href="#" title=" ">Sous menu 6.1</a></li>
<li><a href="#" title=" ">Sous menu 6.1</a></li>
</ul>
</li>
<li><a href="#" title="About us">About us</a></li>
<li><a href="#" title="autres sites">Other sites</a>
<ul>
<li><a href="#" title=" ">Sous menu 8.1</a></li>
<li><a href="#" title=" ">Sous menu 8.2</a></li>
</ul>
</li>
</ul>
</div>
</div>
</body> |
et le CSS qui va avec :
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
|
body {
margin: 0;
padding: 0;}
#header {
height: 114px;
margin: auto;}
/* -------------------------------------- */
/* MENU */
/* -------------------------------------- */
#navbar {
background: url("ressources/images/header_band.gif") repeat-x; }
dt, dl, dd, ul, li {
list-style-type: none;
margin: 0 0 0 0;
position: center;}
.nav_menu_haut {
line-height: 23px;
font-size: 0.8em;
float: left;
display: block;
position: absolute;}
/* mise à l'horizontale du menu */
.nav_menu_haut li {
display: block;
float: left;}
/* les menus sont cacher par defaut */
.nav_menu_haut ul {
display: block;
left: 0;
height: 23px;
width: 100%;
visibility: hidden;
position: absolute;
clear: both;}
.nav_menu_haut:after {
content: ".";
height: 0;
display: block;
visibility: hidden;
overflow: hidden;
clear: both; }
.nav_menu_haut li.selected ul, .nav_menu_haut li:hover ul {
visibility: visible; }
.nav_menu_haut li.selected ul {
z-index: 10; }
.nav_menu_haut li:hover ul {
z-index: 100; }
.nav_menu_haut {
background: url("ressources/images/header_band.gif");
width: 100%;
.nav_menu_haut a {
color: #ffffff;
text-decoration: none;
padding: 2px 18px 2px;
display: block;}
.nav_menu_haut li:hover {
color: #ffffff;
background-color: #ff9900;}
.nav_menu_haut li:hover a {
color: #425484;}
.nav_menu_haut li:hover ul {
background-color: #ffffff;}
.nav_menu_haut ul {
top: 2,1em;
background: #dbe4f2;
color: #425484;}
.nav_menu_haut li li a {
color: #ffffff; }
.nav_menu_haut li li a:hover {
color: #ffffff; }
.nav_menu_haut li.selected a, .nav_menu_haut li.selected, .nav_menu_haut li.selected a:hover {
background: #dbe4f2; color: #425484; }
.nav_menu_haut li.selected, .nav_menu_haut li.selected:hover a, .nav_menu_haut li.selected ul {
background-color: #dbe4f2; } |
Merci à chacun de ceux qui voudront bien apporter leur petite pierre et m'aider dans mon chemin de croix.
Bonne journée à tous.
