Menu vertical déroulant sur une page centrée : c'est possible ?

Bonjour,

Je cherche un peu partout sur le web des exemples de menu déroulant vertical classique avec un niveau de sous-rubrique.
Dans tous les exemples que je vois, les blocs des sous-rubriques s'affichent en coordonnées absolues ("position:absolute").
Je voudrais savoir avant de continuer à m'arracher les cheveux si c'est possible d'avoir un menu vertical sur une page centrée (donc il va falloir utiliser soit des blocs en float soit en position relative) ?

merci de votre aide

Salut,

Je pense qu'un petit tour dans la galerie des menus en CSS te renseignera bien sur la question en te donnant déja une bonne base. Si tu as ensuite des problèmes à comprendre le tout, n'hésite pas à demander de l'aide

Merci de ta réponse.
Justement, j'ai bien regardé la galerie et étudié de près le menu suivant ici

et j'essaie de transformer le positionnement absolu en autre chose... mais j'arrive pas.
J'ai essayé de placer les blocs en float.
Mais ça ne marche pas. tout s'affiche à la suite.
Je me demande si je dois pas plutot utiliser un positionnement relatif.
ça fait plusieurs jours que je suis dessus...
Qu'en penses-tu ? qu'en pensez-vous ?

merci
Modifié par quizz (30 Mar 2007 - 12:47)

Je ne suis pas sure que ca l'aide beaucoup car ce ne sont pas des menus déroulants.

Par contre, je crois que ton problème vient d'une mauvaise connaissance de la position absolu ! en effet, un élément possitionné en absolu se positionne par rapport à son premier parent positionné, et donc pas forcément par rapport à la page. Il n'y a donc aucun contradiction entre site centré et sous menu en position absolu. Il suffit que l'élément conteneur du sous menu (souvent la balise li du menu principal) soit déclaré en position relative (sans lui donner de valeur pour top et left, comme ca, ca ne change en fait rien à sa position).

Ensuite, il suffit que ton menu soit placé de queques facon que ce soit (en flux normal par exemple) dans le conteneur de ta page, lui même centré.

Merci ta réponse m'éclaire beaucoup.

Mais comment réagit un élément positionné en ablolu si son parent est positionné en float ? Est ce que c'est compatible ?

Il vaut mieux que tout soit en absolu alors je suppose..

quizz a écrit :

Mais comment réagit un élément positionné en ablolu si son parent est positionné en float ? Est ce que c'est compatible ?

Le mieux pour avancer dans ce genre de problème c'est de faire des tests

sinon bien avoir à l'esprit qu'il n'y a aucun souci à ce qu'un même élément soit en même temps en float et en position:relative;

Par contre la solution du tout en position:absolute; est à éviter.

bon courage

bon voilà, j'ai bien travaillé grâce à vos conseils et j'ai réussi enfin à centrer ma page et mon menu.
ça peut servir à d'autres...
La feuille se style est dans la source.

voir le résultat

Mais j'ai presque tout mis en absolute pour y arriver.
pourquoi c'est moins bien que relative ?
Parce que ça retire du flux ?
Question bête, pourquoi c'est pas bien de positionner hors-flux ?
Modifié par quizz (30 Mar 2007 - 14:34)

quizz a écrit :
Mais j'ai presque tout mis en absolute pour y arriver.

Arf bonne chance pour la suite

quizz a écrit :
pourquoi c'est moins bien que relative ?

En fait ce sont deux modes qui n'ont strictement rien à voir : le positionnement absolu sort l'élément du flux; le "positionnement" relatif n'est pas vraiment un positionnement. Il ne s'agit que d'un décalage. C'est une simple variante du positionnement classique en flux

quizz a écrit :
Parce que ça retire du flux ?

Oui

quizz a écrit :
Question bête, pourquoi c'est pas bien de positionner hors-flux ?

Parce que tes éléments ne sont plus dépendants les uns des autres. Du coup, ta page n'a plus de structure globale.
Par exemple une page bien conçue peut aisément être modelée (ajout/suppression de contenu, modification de la taille du texte) : puisque tous les éléments interagissent entre eux, l'ensemble reste cohérent.
Cependant, quand tes éléments sont hors flux, ce n'est plus le cas. Tu peux essayer en agrandissant la taille de police par exemple.

D'accord.
merci beaucoup à tous, ça va finir par rentrer à la fin...