28172 sujets

CSS et mise en forme, CSS3

Bonjour !

Le titre n'est pas des plus clairs (mais je n'ai rien trouvé de mieux)

J'ai un menu horizontal qui est est une liste (<UL>) dont j'ai mis les <LI> en float:left;. Jusque là, c'est du tout classique.

Je dois afficher en dessous du titre principal sélectionné, un sous-menu dont les titres sont un peu plus long que le titre principal. Pour ce faire, j'ai créé un <UL> dans le <LI> concerné, mais que j'ai du mettre en position:absolute; afin de lui donner une longueur plus grande que celle de son conteneur (le <LI> principal, donc).

L'objectif est d'éviter un énorme espace entre deux titres principals du menu à cause d'un sous-menu trop large.

Mais en utilisant un position:absolute; je fais sortir le sous-menu du flux normal, qui ne le "voit" plus. Et donc le contenu de la page vient est recouvert. Ce qui n'est pas souhaité.

Un exemple (dynamique) est visible ici : http://www.capharnaum.be/css/sousmenu/index.php

Je cherche un moyen (propre) d'avoir un sous-menu qui puisse être plus large que son titre principal concerné et que le contenu de la page s'affiche alors à la suite de ce sous-menu.

Je ne peux pas fixer une hauteur car la hauteur (le nombre de titres) du sous-menu est tout à fait variable.

Avez-vous une technique à me conseiller ? (ou de la lecture à me recommander ?)

D'avance merci pour votre lumière à ce sujet !