menu déroulant qui ne fontionne pas avec IE7 et 8.

**cireultra** · 09/05/2009, 15h45

Bonjour,

Un menu horizontal avec sous menu en css qui ne fonctionne pas avec IE 7 et 8.

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 :

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
 
<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

**Macmillenium** · 09/05/2009, 19h03

Bonjour,

Envoyé par cireultra

Si vous avez une idée.

Tu es en mode de rendu Quirks à cause de l'absence d'un Doctype correcte et complet

A rajouter au tout début de ton code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">

**cireultra** · 11/05/2009, 14h25

OK merci ça fonctionne avec le doctype.

A +,

Cireultra

menu déroulant qui ne fontionne pas avec IE7 et 8.

CSS

Discussions similaires

Partager

Partager