menu déroulant qui ne fontionne pas avec IE7 et 8.
Bonjour,
Un menu horizontal avec sous menu en css qui ne fonctionne pas avec IE 7 et 8.:cry:
Le sou menu est sous « menu2 ».
Tout le code est sur le même page.
Fonctionne très bien avec Firefox, Chrome et Safari.
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
|
<html>
<head>
<title>Menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #7C0406;
}
.menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
width:780px;
height:32px;
position:relative;
font-size:12px;
z-index:100;
}
.menu ul li a {
display:block;
text-decoration:none;
width:95px;
height:28px;
color:white;
border:0px;
line-height:32px;
font-size:12px;
overflow:hidden;
}
.menu ul {
color:#ffcc33;
padding:0;
margin:0;
list-style:none;
}
.menu ul li {
float:left;
position:relative;
}
.menu ul li ul {
display:none;
}
.menu ul li:hover a {
color:#ffcc33;
font-size:12px;
}
.menu ul li:hover ul {
display:block;
margin:0;
padding:0;
position:absolute;
top:24px;
left:0;
}
.menu ul li:hover ul li a {
display:block;
background:#ffdf80;
color:#000000;
width:120px;
}
.menu ul li:hover ul li a:hover {
background:#ffcc33;
color:#000000;
}
.menu ul li:hover ul li:hover ul {
display:block;
position:absolute;
left:105px;
top:0;
}
-->
</style>
</head>
<body>
<div class="menu">
<ul>
<li>
<div align="center"><a href="#">menu1</a></div>
</li>
<li>
<div align="center"><a href="#">menu2</a>
<ul>
<li><a href="#">sous menu1</a></li>
<li><a href="#">sous menu2</a></li>
<li><a href="#">sous menu3</a></li>
<li><a href="#">sous menu4</a></li>
</ul>
</div>
</li>
<li>
<div align="center"><a href="#">menu3</a></div>
</li>
<li>
<div align="center"><a href="#">menu4</a> </div>
</li>
<li>
<div align="center"><a href="#">menu5</a></div>
</li>
<li>
<div align="center"><a href="#">menu6</a></div>
</li>
<li>
<div align="center"><a href="#">menu7</a></div>
</li>
<li>
<div align="center"><a href="#">menu8</a></div>
</li>
</ul>
</div>
</body>
</html> |
Si vous avez une idée.
Merci d’avance.
A +,
Cireultra
