supprimer le retrait des listes a puces des menus en css
Bonjour
J'ai un petit menu en css sur mon site, grâce à developpez.
J'ai mis mon menu dans une div avec width: 106px . Dans mon menu la taille de mon #menu_gauche li est de 100px
Normalement, #menu_gauche li étant plus petit, il doit rentrer facilement dans ma div. Sauf que j'ai un maximum de débordement sur la droite, que j'ai crois être le retrait du aux listes à puce. J'ai essayé de placer "list-style-position:inside;" pour palier ce débordement, mais rien n'y fait...
pour plus de précision voici le code html :
Code:
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
|
<div class="contenant_colonne_gauche">
<!--menu gauche-->
<div id="menu_gauche">
<ul class="niveau1">
<li>
Seniors
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
18 ans
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
15 ans
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
13 ans
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
benjamins
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
poussins
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
Débutants
<ul class="niveau2">
<li>equipe 1</li>
<li>equipe 2</li>
<li>equipe 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
Arbitres
<ul class="niveau2">
<li>Arb 1</li>
<li>Arb 2</li>
<li>Arb 3</li>
</ul>
</li>
</ul>
<ul class="niveau1">
<li>
Fitness
<ul class="niveau2">
<li>equipe 1</li>
</ul>
</li>
</ul>
</div> |
et le css :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14
|
/* menu_gauche */
#menu_gauche ul ul {display: none; left: 104px; top: -1px; position: absolute; margin:0px; padding: 0px; border: 1px solid transparent;}
#menu_gauche li {
list-style-type: none;
position: relative;
width: 100px;
background-color:transparent;
padding: 2px;
margin: 0px;
background-image: url(/essence/images/bg.png);
}
#menu_gauche li:hover {background-color: transparent;}
#menu_gauche li:hover ul.niveau2{display: block;} |
merci pour vos précieuses précisions.