Discussion :

[subakuno]

Bonjour à tous,

Alors voila, mon amie est en train de créer sa société. Comme elle cherche à se faire connaitre, j'essaie de lui bricoler un petit site web en attendant qu'elle ait les moyens d'investir.

Mes connaissances sont très limités en la matière mais avec un peu de persévérance j'arrive malgré tout à un résultat visuel correct.

Je m'adresse à vous car je me trouve face à un problème que je ne sais résoudre : un problème de menu déroulant.

J'ai créé un menu déroulant et même si il s'affiche correctement sous Firefox ou Chrome :
Pièce jointe 167514

Il ne s'affiche pas correctement sous internet Explorer puisqu'il s'affiche à plat et non verticalement :
Pièce jointe 167513

Voici mon html :

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
20
21
22
<div id="menu">
<ul>
    <li><a href="#">ACCUEIL</a>
    <ul>
      <li><a href="#">Présentantion</a></li>
      <li><a href="#">Notre métier</a></li>
      <li><a href="#">Notre équipe</a></li>
    </ul>
  </li>
  <li><a href="#">NOS MISSIONS</a>
    <ul>
      <li><a href="#">Sous-item 1</a></li>
      <li><a href="#">Sous-item 2</a></li>
      <li><a href="#">Sous-item 3</a></li>
    </ul>
  </li>
  <li><a href="#">NOUS CONTACTER</a></li>
   <li><a href="#">LIENS UTILES</a></li>
</ul>
</div>
 
	</div>

le css (il est vraiment pourri je suis désolé par avance pour ce que ça va choquer. J'en ai conscience mais je ne suis pas développeur... :/ )

Code css :

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
#menu a {
	width: 25%;
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	font-weight: bolder;
	float: left;
	text-transform: uppercase;
	text-align: center;
	background-color: #4D4D4D;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 0px;
	overflow-x: visible;
	opacity: 1;
	z-index: 16;
}
 
#menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 z-index: 1000
 }
 
#menu a:hover     ,#menu:active,#menu:focus,#menu a.thispage{
	background-color: #43a6cb;
	text-decoration: none;
}
 
#menu li {
 position: relative
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 }
 
 #menu li a {
 display:block;
 width:240px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu li a:hover {
	color: #F8F8F8;
	z-index: 0;
 }
 
#menu ul li ul {
 display:none;
 }
 
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
 
 #menu li ul {
 position:absolute;
 }
 
 
 [if !IE]> <
<style type="text/CSS">
#menu li ul {
 position:absolute;
 }

Quelqu'un aurait-il déjà rencontré le problème ou aurait-il la solution à ce problème ?

Si quelqu'un pouvait me sauver je le remercie d'avance

sbk

[prodev73]

Bonjour,

Lorsque j’exécute ton code sous ie, chrome ou firefox, les menu apparaissent a plat et non verticaux
Je ne peut pas non plus voir les pièces jointes qui n'ont pas l'air valide donc je ne peut pas me faire une idée de ce que tu veut.
J'ai remarqué une erreur a la ligne 32 puisqu'il manque un ;

Si ton site est online, pourrais tu nous donner l'url que l'on puisse voir.

[Invité]

Bonjour,

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
#menu a {
	width: 25%;
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	font-weight: bolder;
	float: left;
	text-transform: uppercase;
	text-align: center;
	background-color: #4D4D4D;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 0px;
	overflow-x: visible;
	opacity: 1;
	z-index: 16;
}
 
#menu ul {
 position: relative;
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 z-index: 1000
 }
 
#menu a:hover     ,#menu:active,#menu:focus,#menu a.thispage{
	background-color: #43a6cb;
	text-decoration: none;
}
 
#menu li {
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 }
 
 #menu li a {
 display:block;
 width:240px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu li a:hover {
	color: #F8F8F8;
	z-index: 0;
 }
 
#menu ul li ul {
 position: relative;
 display:none;
 }
 
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
 
 #menu li ul {
 position:absolute;
 }

[subakuno]

Salut merci pour beaucoup vos réponses et de votre aide.

Mon problème de menu est résolu.