Bonjour, 
Je cherche actuellement à faire un site avec un menu horizontal, un sous menu vertical et un sous sous menu horizontal.
J'ai cherché un moment et je n'arrive pas à faire mon sous sous menu en horizontal... Pour le reste tout marche nickel !
Quelqu'un aurait une solution pour mon problème ?
Merci d'avance.
Voici mon bon de code :
Et voici mon le bout de CSS qui gère le menu :
Modifié par Felipe (24 Mar 2011 - 17:45)
      
      
    Je cherche actuellement à faire un site avec un menu horizontal, un sous menu vertical et un sous sous menu horizontal.
J'ai cherché un moment et je n'arrive pas à faire mon sous sous menu en horizontal... Pour le reste tout marche nickel !
Quelqu'un aurait une solution pour mon problème ?
Merci d'avance.
Voici mon bon de code :
<ul id="menu"> 
<li> 
<a href="#">XXX</a> 
</li> 
<li> 
<a href="#">XXX</a> 
<ul> 
<li><a href="#">XXX</a> 
<ul><li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
</ul> 
</li> 
<li><a href="#">XXX</a> 
<ul><li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
</ul> 
</li> 
<li><a href="#">XXX</a> 
<ul><li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
</ul> 
</li> 
<li><a href="#">XXX</a> 
<ul><li><a href="#">XXX</a></li> 
</ul> 
</li> 
</ul> 
</li> 
<li> 
<a href="#">XXX</a> 
<ul> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
<li><a href="#">XXX</a></li> 
</ul> 
</li> 
<li> 
<a href="#">XXX</a> 
</li> 
</ul> 
</div> 
Et voici mon le bout de CSS qui gère le menu :
#menu, #menu ul 
{ 
padding : 0; 
margin : 0; 
list-style : none; 
line-height : 21px; 
text-align : left; 
} 
#menu 
{ 
font-family : Arial; 
font-size : 14px; 
margin-top: 60px; 
float: right; 
} 
#menu a 
{ 
display : block; 
padding : 0; 
color : #000; 
text-decoration : none; 
width : 110px; 
} 
#menu li 
{ 
float : left; 
border-right : 1px solid #fff; 
} 
html>body #menu li 
{ 
border-right: 1px solid transparent ; 
} 
#menu li ul 
{ 
position: absolute; 
width: 105px; 
left: -999em; 
} 
#menu li ul li 
{ 
border-top : 1px solid #fff; 
} 
html>body #menu li ul li 
{ 
border-top : 1px solid transparent; 
} 
#menu li ul ul 
{ 
margin : -22px 0 0 100px ; 
border-left : 1px solid #fff ; 
list-style-type:none; 
} 
html>body #menu li ul ul 
{	
border-left : 1px solid transparent ; 
} 
#menu li ul ul {	
margin : -22px 0 0 105px ; 
float:left; 
} 
#menu a:hover 
{ 
color: #000; 
} 
#menu li:hover ul ul, #menu li.sfhover ul ul 
{	
left: -999em; 
} 
#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul 
{ 
left: auto; 
min-height: 0; 
}
 Modifié par Felipe (24 Mar 2011 - 17:45)