Menu multilevel (besoin de mettre le sous-menu a gauche!!)
Menu multilevel (besoin de mettre le sous-menu a gauche!!) - HTML/CSS - Programmation
Sujets relatifs:
- Menu 5 onglets
- Menu déroulant au passage de la souris
- Probleme centrage menu
- Un petit menu déroulant
- mettre quelqu'un en ignore list?
- Mettre des images en colone
- Besoin d'aide pour mon prog en C#
- Cherche menu sur deux lignes
- [Access] Besoin d'aide avec les fonctions de date dans Access.
- Menu de vignettes images
Marsh Posté le 09-02-2009 à 16:46:23
Bonjour, menu est fonctionnel par contre j'aumerai que lorque j'ai un menu a plus de deux étage j'aimerai que le sous-menu apparaisse a gauche au lieu de la droite.
vous pouvez voir le site web c'est le dernier menu a gauche qui nous intéresse.http://www.imacom.qc.ca/ateliercfm
J'ai ce menu:
Mais je veux celui-ci.
feuille de style:
[PHP]
body {margin:25px; font:11px Verdana,Arial; background:#eee}
ul.menu {list-style:none; margin:0; padding:0}
ul.menu * {margin:0; padding:0}
ul.menu a {display:block; color:#000; text-decoration:none}
ul.menu li {position:relative; float:left;}
ul.menu ul {position:absolute; top:36px; left:0; background:#dedede; display:none; opacity:0; list-style:none}
ul.menu ul li {
position:relative;
width:153px;
margin:0;
vertical-align:middle;
border: 1px solid #757d86;
}
ul.menu ul li a {
display:block;
text-align:center;
background:dedede;
color:#444444;
font: 11px arial;
z-index: 200;
padding: 5px 10px;
}
ul.menu ul li a:hover {
background:#0a71c0;
color:#FFFFFF;}
ul.menu ul ul {left:-153px; top:-1px}
ul.menu ul li ul li {}
ul.menu .menulink1 {font-weight:bold; background:url(../images/a_propos_fr.jpg); width:158px; height:40px}
ul.menu .menulink2 { font-weight:bold; background:url(../images/services_fr.jpg); width:158px; height:40px}
ul.menu .menulink3 { font-weight:bold; background:url(../images/robotique_fr.jpg); width:158px; height:40px}
ul.menu .menulink4 { font-weight:bold; background:url(../images/inspection_fr.jpg); width:158px; height:40px}
ul.menu .menulink5 { font-weight:bold; background:url(../images/equipement_serie_fr.jpg); width:158px; height:40px}
ul.menu .menulink6 { font-weight:bold; background:url(../images/equipement_autre_fr.jpg); width:158px; height:40px}
ul.menu .sub {background:#d1d1d1 url(../images/arrow.gif) 145px 8px no-repeat}
ul.menu .topline {}
[/PHP]
Menu html:
[HTML]
<ul class="menu" id="menu">
<li>
<a href="index.php?page=preview&cat=4" class="menulink6"></a><ul>
<li>
<a href="index.php?page=product&cat=4&prod=17">Appareils d'usinage</a>
<ul>
<li><a href="index.php?page=product&cat=4&prod=18">Têtes à usiner et à poser charnières de portes d'armoire</a></li>
<li><a href="index.php?page=product&cat=4&prod=19">Appareil usinant contour couvercle de cercueil</a></li>
<li><a href="index.php?page=product&cat=4&prod=20">Appareil assemble et usine montants de portes</a></li>
<li><a href="index.php?page=product&cat=4&prod=21">Appareil fait l'éboutage planches de bois</a></li>
<li><a href="index.php?page=product&cat=4&prod=22">Appareil usinant trous d'injection (traverses de porte d'acier)</a></li>
<li><a href="index.php?page=product&cat=4&prod=23">Machines encoches</a></li>
</ul>
</li>
<li>
<a href="index.php?page=product&cat=4&prod=24">Systèmes de découpe</a>
<ul>
<li><a href="index.php?page=product&cat=4&prod=25">Appareils de découpe</a></li>
<li><a href="index.php?page=product&cat=4&prod=26">Appareil de découpe (véhicule)</a></li>
<li><a href="index.php?page=product&cat=4&prod=27">Appareil de découpe, inspection, perforation en moulage</a></li>
<li><a href="index.php?page=product&cat=4&prod=28">Appareil de perforation des trous (pièces de véhicule récréatif)</a></li>
</ul>
</li>
<li>
<a href="index.php?page=product&cat=4&prod=29">Appareils d'assemblage</a>
<ul>
<li><a href="index.php?page=product&cat=4&prod=30">Appareil d'assemblage et d'inspection 2</a></li>
<li><a href="index.php?page=product&cat=4&prod=31">Appareil d'assemblage et d'inspection 1</a></li>
<li><a href="index.php?page=product&cat=4&prod=32">Appareil d'assemblage de panneaux</a></li>
<li><a href="index.php?page=product&cat=4&prod=33">Appareil d'assemblage</a></li>
<li><a href="index.php?page=product&cat=4&prod=34">Presse à barreaux</a></li>
<li><a href="index.php?page=product&cat=4&prod=35">Modèles de presse variés</a></li>
<li><a href="index.php?page=product&cat=4&prod=36">Colleuse de styromousse</a></li>
</ul>
</li>
</ul>
</li>
</ul>
[/HTML]
Merci pour tout l'aide qui peux m'être apporté!