Je recherche pour un collègue un menu drop-down, si possible entièrement en CSS qui s’afficherait de manière justifiée. C’est à dire qu’en fonction du nombre d’éléments dans le menu (éléments chargés dynamiquement of course), les éléments du menu s’allongeraient ou se raccourciraient pour que l’ensemble fasse toujours la même taille.
J’ai fait une recherche google, mais je ne trouve rien de tout ça. Est-ce que quelqu’un a une idée?
Euh que le menu fasse toujours la même taille en largeur? Qu’est ce que tu fais si un élément du menu dispose d’un contenu texte trop grand pour la cellule? parce que si tu t’en fous, t’as la technique simple de: (considérant un menu a base de ul li)
ul#menu
{
width: 200px;
}
ul#menu li
{
display: block;
float: left;
text-align: center;
width: 20%; /* pour 5 éléments */
}
ul#menu li
{
display: block;
float: left;
text-align: center;
width: 20%; /* pour 5 éléments */
}[/quote]
Ben tu as exactement touché du doigt le problème dans ton exemple… nous ne connaissons pas le nombre d’entrées dans le menu à l’avance, donc impossible d’utiliser le width: 20%…
En CSS ce n’est pas possible (à part avec des tableaux )
En javascript tu peux faire un truc du genre : largeur élément du menu = largeur totale/le nombre d’élément de ton menu.
Si j’ai bien compris, tu veux que le sous-menu (celui qui appraît au clique du menu) adapte sa taille en fonction du nombre d’éléments dans le menu.
Une solution serait de stocker le sous-menu dans le block contenant le menu. Comme ça il prend d’office la taille de son parant (le menu) et t’as plus besoin d’y réflechir ça s’adaptera automatiquement.
Ca doit pas être bien compliqué d’adapter un menu déroulant CSS existant pour qu’il fasse ça.