28173 sujets

CSS et mise en forme, CSS3

Bonjour tout le monde !

Je suis en train de développer un menu en css + javascript et je rencontre quelques problèmes d'affichage :

1er) Le menu déroulant devrait s'afficher au dessus du reste du site
2ème) Quand la souris n'est pas sur le menu, le sous-menu devrait se replier.

lien vers le site : http://www.alexance-hosting.com/altheo-entrepreneurs-19-10-07/

CSS du menu :

#menu {
	width:1000px;
	height:26px;
	z-index:100;
	padding:0px;
	margin:0px;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
}

#head {
	width:1000px;
	height:26px;
}

#submenu {
	clear:both;
	float:left;
	margin:0px;
}

#submenu ul li {
	list-style:none;
	background-color:#FFFFFF;
	border-left:1px solid #000000;
	margin:0;
	padding:0px;
	
}

#submenu ul li:hover { /*non interpreté par ie*/
	background-color:#84A7CF;
	cursor:pointer;
}

#submenu ul li a,
#submenu ul li a:visited {
	color:#000000;
	text-decoration:none;
	padding-left:10px;
	width:200px;
	padding-right:10px;
	display:block;
}

#submenu ul li a:hover {
	color:#FFFFFF;
	background-color:#84A7CF;
	cursor:pointer;
}

#sub1 {
	position:relative;
	left:0px;
	top:0px;
	margin:0;
	padding:0;
	z-index:50;
	display:none;
}

#sub2 {
	position:relative;
	left:96px;
	top:0px;
	margin:0;
	padding:0;
	z-index:50;
	display:none;
}




Si vous avez des conseils, ils sont les biens venus
Merci de votre aide.

A +

Ingrid
Bonjour,

a écrit :
1er) Le menu déroulant devrait s'afficher au dessus du reste du site
Il faut le positionner en absolu.
a écrit :
Quand la souris n'est pas sur le menu, le sous-menu devrait se replier.
Essaie avec :
<div style="float:left; cursor:pointer;" onmouseover="javascript:show('sub1');" onfocus="javascript:show('sub1');" onmouseout="javascript:show('');"><a href="qui-sommes-nous.php"><img src="images/global/bloc-menu/altheo.jpg" width="150" height="26" border="0" /></a></div>
Ce tutoriel devrait t'aider.
Quand je mets le menu en position absolute celui ci se place tout en haut du site.

Je ne vois pas comment corriger ce bug ...