Menu avec des <ul> et min-width
Hello :D,
Je suis entrain de faire un menu, menu auquel je ne voudrais pas donner de largeur fixe (ni %, ni px)
-> je voudrais qu'il s'adapte automatiquement au nombre d'items du menu
menu.php
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
| <ul id="main-navigation" style="border: 2px solid red;">
<li>
<a href="index.php">Menu1</a>
<ul>
<li><a href="index.php">sous-menu1</a></li>
<li><a href="index.php">sous-menu2</a></li>
<li><a href="index.php">sous-menu3</a></li>
</ul>
</li>
<li>
<a href="index.php">Menu2</a>
<ul>
<li><a href="index.php">sous-menu1</a></li>
<li><a href="index.php">sous-menu2</a></li>
</ul>
</li>
<li>
<a href="index.php">Menu3</a>
</li>
<li>
<a href="index.php">Menu4</a>
</li>
</ul> |
css:
Code:
1 2 3 4 5 6 7 8 9 10
| #main-navigation {
background: #484848;
width: 60%;
text-align: center;
height: 65px;
margin: auto;
margin-top: 20px;
font-size: 17px;
font-underline: none;
} |
Ma question:
-> avec un width: 60%; , mon menu est correct: ok
-> mais l'idée était de faire une structure qui passerait automatiquement à 70, ou 80% (voire 100%) SI je rajoutais des items dans mon code PHP, sans avoir à modifier le .css, bien sûr
-> un peu comme un menu standard pour les users lambda, menu qui serait complété par un autre item pour les admin, par exemple, vous voyez?
J'ai donc de suite pensé à l'attribut min-width.......... mais ça ne fonctionne pas!
J'ai regardé en ligne http://www.w3schools.com/cssref/pr_dim_min-width.asp, mais on ne parle que d'une utilisation pour un <p>... étrange à mes yeux, mais soit! :weird:
J'ai donc englobé mon menu dans un <p style="min-width: 50%; border: 2px solid blue;"> </p>
-> marche pas mieux
-> pire: mon cadre bleu de débug fait 100% de la largeur ET en plus mon menu se trouve en dessous, et non à l'intérieur:weird:
Donc:
-> est-ce-que qq'un aurait une idée?
-> je ne peux pas croire que c'est impossible à faire, c'est donc forcément moi qui merde qq part...
Merci. :coucou: