Bonjour,
Je suis un nouveau étudiant en web ça fait 4 mois que j'ai commencé une formation,
là je suis en stage et on me demande de faire un menu imbriqué, un menu sous un menu sous un menu,
Et le problème, c'est que j'arrive a faire le sous menu du premier menu mais pour faire un autre sous menu sous le deuxième sous menu ça ne fonctionne pas il se mets automatiquement en bas,
J'aimerais placer le deuxièmes sous menu a droite au lieux d'en bas
exemple dans le code en dessous il y a item1 item2 item3, sur l'item2 il y a un sous menu qui se nome sous-item 1 et sur le sous item 1 j'aimerais placé le sous sous item qui viendrait se placer a droite au lieux d'en bas
bien a vous
voila mon code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IMTECH BELGIUM</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<div id="menu">
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<ul>
<li>
<a href="#">Sous-item 1</a>
<ul id="sousmenu"><li><a href="#">sous sous item</a></li></ul>
</li>
<li><a href="#">Sous-item 2</a></li>
<li><a href="#">Sous-item 3</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
</ul>
</div>
</body>
</html>
#menu ul {
margin:0 auto;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:0 auto;
padding:0;
background-color:#2446ab;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#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;
}
Je suis un nouveau étudiant en web ça fait 4 mois que j'ai commencé une formation,
là je suis en stage et on me demande de faire un menu imbriqué, un menu sous un menu sous un menu,
Et le problème, c'est que j'arrive a faire le sous menu du premier menu mais pour faire un autre sous menu sous le deuxième sous menu ça ne fonctionne pas il se mets automatiquement en bas,
J'aimerais placer le deuxièmes sous menu a droite au lieux d'en bas
exemple dans le code en dessous il y a item1 item2 item3, sur l'item2 il y a un sous menu qui se nome sous-item 1 et sur le sous item 1 j'aimerais placé le sous sous item qui viendrait se placer a droite au lieux d'en bas
bien a vous
voila mon code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IMTECH BELGIUM</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<div id="menu">
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<ul>
<li>
<a href="#">Sous-item 1</a>
<ul id="sousmenu"><li><a href="#">sous sous item</a></li></ul>
</li>
<li><a href="#">Sous-item 2</a></li>
<li><a href="#">Sous-item 3</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
</ul>
</div>
</body>
</html>
#menu ul {
margin:0 auto;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:0 auto;
padding:0;
background-color:#2446ab;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#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;
}
