28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je suis en train de refaire le design d'un site web, et j’intègre un menu déroulant.
J'ai un problème car j'ai une div qui est sous le menu (elle affiche un flux twitter) mais lorsque qu'on "déplie" le menu en passant la souris sur une en-tête de menu, le sous-menu s'affiche sous la div qui affiche le fil twitter.
Voici un exemple : http://www.arogues.org/menu_test2.html

la div qui est a une bordure noire est celle ou le fil twitter défile. J'ai tout enlevé (le bout de JS et autre) afin d'isoler mon problème... Mais je n'arrive pas à trouver une solution...

Si quelqu'un a une idée de comment résoudre mon problème, ce serait super Smiley smile

Merci d'avance !
Antoine
Bonjour,
je pense qu'il suffit d'ajouter un z-index comme ceci :


#menuDeroulant
{
	background: transparent;
	(...)
	left: 280px;
	z-index:1000
}
Le problème, selon moi, est à la base. Pourquoi définis-tu ton menu déroulant en position:absolute ? Même question pour le position:relative du bandeau Twitter.
Je te conseille de laisser le plus d'éléments possibles dans le flux (voir cet article : http://www.alsacreations.com/article/lire/533-initiation-au-positionnement-en-css.html ), et de n'en sortir que si c'est vraiment nécessaire.

Dans ton cas précis, enlève le position:absolute et le position:relative, et hop, le menu passe par-dessus ! Alors, oui, tous tes éléments se collent à gauche, mais après tu joues avec les marges Smiley cligne
Merci pour le z-index ! Je l'avais compris à l'envers, avait déjà essayé mais en donnant un ordre plus faible !
Ca marche parfaitement.

Pour ce qui est positionnement, je ne comprend pas trop l’intérêt d'enlever les positions pour passer en marge ? (après avoir lu le tutoriel).
J'avoue qu'avant j'aurai fait tout ca dans un tableau mais après avoir un peu lu j'ai vu que les div étaient plus "adaptées" (et c'est vrai que le code et sa maintenance est bien plus aisée !).