menu et sous menu
Posté : 18 juil. 2013, 17:14
Bonjour,voila il me reste plus qu'a faire un menu avec un sous menu pour finir mon travail, mais quand j'essaye de le faire mon sous menu se met a vibrer, non stable et qui n'est pas un bloc lorsque je passe la souris sur l'onglet qui doit déployer mon sous menu: voilà mon code de menu et mon CSS pour le menu.
qu'est ce que je dois faire pour que, lorsque je passe la souris sur mon dernier onglet, le sous menu se développe de façon correct.
Code php (que j'utilise comme masterpage):
qu'est ce que je dois faire pour que, lorsque je passe la souris sur mon dernier onglet, le sous menu se développe de façon correct.
Code php (que j'utilise comme masterpage):
<?php if (!isset($_SESSION['matricule']) or !isset($_SESSION['nom'])) {
header('location: ../index.php');}?>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="../charte/css/style_admin.css" type="text/css"/>
<link rel="stylesheet" href="../css/hyperlink_admin.css" type="text/css"/>
<link href="../css/pagination.css" rel="stylesheet" type="text/css" />
<link href="../css/C_red.css" rel="stylesheet" type="text/css" />
<LINK REL="SHORTCUT ICON" href="../image/favicon.ico">
<link rel="stylesheet" href="../css/ajout_admin.css" type="text/css"/>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="../js/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src='../charte/js/example.js'></script>
<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
</head>
<img src="../image/sqli-agency-mini.png" class="back"/>
<form method="post" action="../index.php">
<input type="submit"id="deconnect" name="deconnect" value="Deconnect" class="bouton_deco" />
</form>
<p class="id_compte">Compte de: <strong><?php echo strtoupper($_SESSION['nom']);?></strong></p>
<div class="nav-wrap">
<ul class="group" id="example-one">
<center>
<li class="current_page_item">
<a href="../collaborateur/accueil.php">Gestion de Congés</a></li>
<li><a href="../administration/collaborateurs.php">Collaborateurs</a></li>
<li><a href="../administration/agence_bu.php">Agence/Bu</a></li>
<li><a>Gestion Role-Statut-Congé</a>
<ul>
<li><a href="..administartion/gestion_role.php">Gestion de rôle</a></i>
<li><a href="..administartion/gestion_statut.php">Gestion de rôle</a></i>
<li><a href="..administartion/type_conge.php">Gestion de type de Congé</a></i>
<li><a href="..administartion/conge_exceptionnel.php">Gestion de Congé Exceptionnel</a></i></ul></li>
</center>
</ul>
</div>
/* Example One */
#example-one {
margin: 0 auto;
list-style: none;
position: relative;
width: 960px;
}
#example-one li {
display: inline-block;
}
#example-one a {
color: #bbb;
font-size: 14px;
float: left;
padding: 6px 10px 4px 10px;
text-decoration: none;
text-transform: uppercase;
}
#example-one a:hover {
color: white;
}
#example-one ul li ul {
display:none;
}
#example-one ul li:hover ul {
display:block;
}
#example-one li:hover ul li {
float:none;
}
#magic-line {
position: absolute;
bottom: -2px;
left: 0;
width: 100px;
height: 2px;
background: #26C4EC;
}
.current_page_item a {
color: white !important;
}
.ie6 #example-one li, .ie7 #example-one li {
display: inline;
}
.ie6 #magic-line {
bottom: -3px;
}