Deux listes à puces

Bonjour,

Je me pose une question sur l'art et la manière de procéder pour la mise en forme suivante :

Je suis en train de mettre en forme une navigation a 1 niveaux, au survol un cadre s'affiche et présente des liens (environ 20) dont une image positionnée à l'extrème droite.

Dans ce style là : -http://www.king-jouet.com/

Concernant les listes a puces, comment mettre en forme le plus proprement possible 1 liste à puce de 10 liens, à côté une autre liste à puce de 10 liens puis une photo a l'extrème droite.

Le fait de mettre la photo dans un div afin de la positionner en float à droite, est-ce propre au niveau de la manière de coder?

Pouvez-vous m'éclairer sur la manière de procéder?

Merci d'avance !


Modifié par Laurie-Anne (16 Mar 2011 - 08:12)

bonsoir,

1 div peut englober les deux liste en flottante. Si l'image ne vehicule aucune info , elle peut-etre disposer en background de ce div en lui reservant un espace adequat via un padding-right ou une largeur definie.

Si l'image vehicule une info, alors il vaut peut-etre mieux la garder dans le code html , a priori elle reflète l'intitulé de lien de premier niveau, inutile de se répéter alors .

Quelle structure html est envisagé pour cette barre de menu a 100 ou 200 liens ?

cordialement

Bonjour,

Est-ce que les deux listes sont vraiment deux objets séparés ou pense tu juste utiliser deux liste pour le visuel ?

Car dans le second cas, une seul liste (avec une largeur de 2x la taille d'une des listes que tu souhaite obtenir visuellement) avec des li flottants obtiendra le même résultat.

Merci pour vos réponses !

Dans un premier temps, l'image ne véhicule aucunne info. Elle est juste là à titre décoratif pour illustrer le thème des liens. L'idéal serait d'avoir 2 div pour les 2 listes (1 div pour 1 liste de 10 liens puis un autre div pour l'autre list de 10 liens puis l'image), probablement.

Je suis parti sur cette solution là : http://greengeckodesign.com/projects/MenuMatic/examples/horizontal/index.htm

Je pencherai plutôt pour deux objets séparés.

Merci d'avance