Bonjour,
Alors, j'expose mon soucis de forme par rapport à l'intégration d'un sous menu (le tout vertical) à base de <ul> et <li>, lorsqu'on utilise Internet Explorer 6 ou 7 il y a visiblement un réel problème d'affichage de la border-bottom des <li> qui dominent le <ul> du sous menus, voici un lien pour l'exemple : http://n0ne.org/menu.php?page=paniers
On peut donc voir que la bordure (bottom) de la catégorie "Paniers" ou "L'entreprise" en utilisant Firefox (par exemple) reste bien à sa place, or lorsqu'on passe sous IE la fameuse bordure se retrouve en dessous du sous menu <ul> ...
Connaitriez-vous une solution afin de parer ce léger soucis ?
Voici le code source de menu.php
D'avance merci pour votre aide.
Cordialement,
Fab
Modifié par fab31 (29 Dec 2008 - 14:56)
Alors, j'expose mon soucis de forme par rapport à l'intégration d'un sous menu (le tout vertical) à base de <ul> et <li>, lorsqu'on utilise Internet Explorer 6 ou 7 il y a visiblement un réel problème d'affichage de la border-bottom des <li> qui dominent le <ul> du sous menus, voici un lien pour l'exemple : http://n0ne.org/menu.php?page=paniers
On peut donc voir que la bordure (bottom) de la catégorie "Paniers" ou "L'entreprise" en utilisant Firefox (par exemple) reste bien à sa place, or lorsqu'on passe sous IE la fameuse bordure se retrouve en dessous du sous menu <ul> ...
Connaitriez-vous une solution afin de parer ce léger soucis ?
Voici le code source de menu.php
<?php
$page = 'page/accueil';
if(!empty($_GET['page']) && is_integer(ereg("^[a-zA-Z0-9\.\-_]+$",$_GET['page'])))
{ $page = 'page/'.$_GET['page'];
if(!file_exists($page.".php")) $page = $_GET['page'];}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Fruits & Co</title>
<style type="text/css" media="screen">
html, body {margin:0; padding:0;}
body {
background:#fff;
font-family:verdana, "trebuchet MS", arial, sans-serif;
font-size:12px;
}
.dispnone {display:none;}
#contenu {margin-top:50px; width:850px;}
#menu {list-style:none; padding:0 40px 0 20px; margin:0;}
#menu li {border-bottom:dotted 1px #888; margin:0;}
#menu li a {padding:6px 5px 4px 3px; color:#777; text-decoration:none; display:block;}
#menu li a:hover {color:#444; text-decoration:none; display:block; background-color:#ddefa2;}
.sousmenu {list-style:none; padding:0 0 0 10px; margin:0; font-size:10px;}
.sousmenu li {border-bottom:dotted 1px #888; margin:0;}
.sousmenu li a {padding:5px 5px 3px 3px !important; color:#777; text-decoration:none; display:block;}
.sousmenu li a:hover {color:#444; text-decoration:none; display:block; background-color:#ddefa2;}
</style>
</head>
<body>
<table align="center" border="0" cellspacing="0" cellpadding="0" id="contenu">
<tr>
<td height="500" width="210" valign="top">
<ul id="menu">
<li><a href="menu.php">Accueil</a></li>
<li><a href="#">Fruits & légumes</a></li>
<li><a href="menu.php?page=paniers">Paniers »</a></li>
<ul class="<?php if ($page=="page/paniers") {echo "sousmenu";} else {echo "dispnone";}?>">
<li><a href="#">Fruits</a></li>
<li><a href="#">Légumes</a></li>
<li><a href="#">Autre</a></li>
</ul>
<li><a href="#">Produits de saison</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Partenaires</a></li>
<li><a href="menu.php?page=entreprise">L'entreprise »</a></li>
<ul class="<?php if ($page=="page/entreprise") {echo "sousmenu";} else {echo "dispnone";}?>">
<li><a href="#">Activité</a></li>
<li><a href="#">Situer</a></li>
<li><a href="#">Contact</a></li>
</ul>
</ul>
</td>
<td valign="top">
<?php include($page.".php"); ?>
</td>
</tr>
</table>
</body>
</html>
D'avance merci pour votre aide.
Cordialement,
Fab
Modifié par fab31 (29 Dec 2008 - 14:56)