CSS - Lien case menu déroulant

Résolu/Fermé
boss183 Messages postés 181 Date d'inscription lundi 7 janvier 2008 Statut Membre Dernière intervention 7 octobre 2011 - 10 juin 2011 à 16:41
boss183 Messages postés 181 Date d'inscription lundi 7 janvier 2008 Statut Membre Dernière intervention 7 octobre 2011 - 14 juin 2011 à 09:51
Bonjour à tous,

j'ai réalisé un petit menu déroulant avec le CSS et les cases contiennent des liens. Pour l'instant, il y a juste le lien qui est cliquable et je souhaiterais que toute ma case soit cliquable.

Ci-dessous mon code CSS :
body
{
	behavior: url("csshover.htc");
	font-family:Trebuchet MS;
	font-size:14px;
	height: 100%;
	
}

#menu_dynamique
{
	width:90%;
	margin: auto;
	padding: auto; 
	height:25px;
	font-family:Trebuchet MS;
	font-size:13px;
	font-weight:bold;
	border: none;	
}

#menu_dynamique li
{ 
	float:left; 
	width: 19%; 
	height:21px; 
	border: 2px solid silver;
	padding-top: 3px;
	text-align:center; 
	color: #5093b2;
	text-decoration: none;
	list-style-type: none;
	background-color: white;
	
}

#menu_dynamique .extend
{
	background-position: right;
	background-color: white;
	border-color: #5093b2; 
}

#menu_dynamique li:hover 
{	
	color: black;
	background-color: #bdb6c6;
}

#menu_dynamique .none 
{
	border-right: none;
	border-left: none;
}

#menu_dynamique .extend .sans
{
	border-top: none;
	border-bottom: none;
}

#menu_dynamique .extend .mil
{
	border-bottom: none;
}

#menu_dynamique .extend .bas
{
	border-top: none;
}

#menu_dynamique li ul li
{
	display: none; 
}

#menu_dynamique .extend:hover 
{
   z-index: 500; 
 }

#menu_dynamique .extend:hover ul li
{
	display: inline;
	position: relative;
	width: 120%;
	height: 21px;
	white-space: nowrap; 
	background: white;
	color:#1875d6;
	padding: 3px;
}

#menu_dynamique .extend:hover ul li
{
	top: 5px;
	left: -42px;
}
A:link { COLOR: #5093b2; FONT-FAMILY: Trebuchet MS; FONT-SIZE: 10pt; font-weight:bold; TEXT-DECORATION: none }
A:visited { COLOR: #5093b2; FONT-FAMILY: Trebuchet MS; FONT-SIZE: 10pt; font-weight:bold; TEXT-DECORATION: none }
A:active { COLOR: #EA4429; FONT-FAMILY: Trebuchet MS; FONT-SIZE: 10pt; font-weight:bold; TEXT-DECORATION: none }
A:hover { COLOR: #EA4429; FONT-FAMILY: Trebuchet MS; FONT-SIZE: 10pt; font-weight:bold; TEXT-DECORATION: none }


et mon menu en HTML :
<ul id="menu_dynamique">

     <li class="extend">Infos & Vulnérabilités<ul>
	<li><a href="traitement.php">Logiciels</a></li>
	<li class="sans"><a href="traitementmat.php">Matériels</a></li>
	<li><a href="traitementclient.php">Clients</a></li>
		
	</ul>
	</li>
	
	<li class="extend none">Gestion du Parc Informatique</a><ul>
	<li><a href="../ouapi1.0/index.php">Gérer le Parc Informatique</a></li>
	<li class="sans"><a href="traitementcontrat.php">Contrats</a></li>
	<li><a href="traitementmarque.php">Marques & Types</a></li>
	
	</ul>
	</li>
	
	<li class="extend">Gestion des infos<ul>
		
		<li><a href="ajout_info.php">Ajouter une info</a></li>
		<li class="bas"><a href="modifinfo.php">Modifier/Supprimer info</a></li>
	    
		</ul>
		
	</li>
		
	<li class="extend none">Gestion des vulnérabilités
		
		<ul>
		
		<li><a href="actu_flux.php">Actualiser les flux RSS</a></li>
		<li class="sans"><a href="ajout_flux.php">Ajouter un flux RSS</a></li>
	    <li class="mil"><a href="removeflux.php">Supprimer un flux RSS</a></li>
		<li><a href="removerss.php">Supprimer vulnérabilité</a></li>				
		</ul>
	
	<li class="extend"><a href="https://www.cheops.fr/fr/division-reseau-securite-et-communications-unifiees" title="Lien vers le site d'Ocealis Sécurité">Ocealis Sécurité</a></li>
	
</ul>


Merci d'avance !
A voir également:

1 réponse

boss183 Messages postés 181 Date d'inscription lundi 7 janvier 2008 Statut Membre Dernière intervention 7 octobre 2011 17
14 juin 2011 à 09:51
Voilà il faut faire ça :

#menu_dynamique li ul li a
{
display:block;
width:100%;
height:100%;
}
0