Bonjour,
Je travail sur le cartouche d'un site composé d'un menu horizontal et un sous menu vertical :
http://www.simple-system.fr/test/cartouche.html
Celui-ci s'affiche correctement dans IE7 mais dans firefox 2 c 'est une boucherie !
Voici le xhtml de la page :
et son CSS
Est ce qu'un des deux navigateurs ne traite pas correctement mes CSS oubien est ce que c'est moi qui ai fait caomme un pied ?
Autre question: c'est correcte dans IE 6 ?
Merci de votre aide !
( et vive les standards
)
Je travail sur le cartouche d'un site composé d'un menu horizontal et un sous menu vertical :
http://www.simple-system.fr/test/cartouche.html
Celui-ci s'affiche correctement dans IE7 mais dans firefox 2 c 'est une boucherie !
Voici le xhtml de la page :
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="Simple System, Cédric Brancourt" />
<meta http-equiv="content-language" content="fr" />
<meta name="Keywords" xml:lang="fr" content="Informatique, solutions, infogerance, web, petites entreprises, depannage, maintenance, artisans, commercants, independants, reseaux, professions liberales, Nantes, pays de loire, 44" />
<meta name="Description" content="Entreprise de services informatiques, dépannage, assistance, maintenance. Pour les professionnels et les paticuliers à Nantes."/>
<meta name="robots" content="index,follow"/>
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
<title>L'informatique simplement</title>
</head>
<body>
<div id="conteneur">
<img id="logo" src="images/logosisys.jpg" alt="Logo de l'entreprise Simple System"/>
<div id="bandeau">
<h1 id="slogan">l'informatique Simplement !</h1>
</div>
<ul id="menu">
<li><a href="">Présentation</a></li>
<li><a href="">Services</a></li>
<li><a href="">Forfaits</a></li>
<li><a href="">Réferences</a></li>
<li><a href="">Fournisseurs</a></li>
<li><a href="">Espace Client</a></li>
<li><a href="">Liens</a></li>
</ul>
<ul id="sousmenu">
<li><a href="">sous menu</a></li>
<li><a href="">sous menu</a></li>
<li><a href="">sous menu</a></li>
<li><a href="">sous menu</a></li>
</ul>
</div>
</body>
</html>
et son CSS
*
{
margin: 0px;
padding: 0px;
}
html
{
height: 100%;
}
body
{height: 100%;
}
#conteneur
{width: 800px;
margin: auto;
}
#logo
{
float: left;
height: 160px;
width: 160px;
display: block;
position: static;
}
#bandeau
{width: 640px;
heigth: 140px;
background-color: #ffcc33;
color: #990066;
font-family: "Trebuchet MS", Arial;
position: static;
margin-left: 160px;
min-height: 130px;
}
#slogan
{text-indent: 30px;
padding-top: 35px;
font-size: 28px;
}
#menu
{
width: 640px;
background-color: #333399;
font-family: "Trebuchet MS", Arial;
font-size: 12px;
font-weight:bold;
list-style: none;
}
#menu li {
float: left;
}
#menu a {
margin: 4px 3px;
width: 80px;
height: 20px;
display: block;
text-align: center;
border: 1px solid #99cc33;
text-decoration: none;
color: #99cc33;
background: #333399;
}
#menu a:hover {
background: #99cc33;
border: 1px solid #99cc33;
color: #333399;
}
#menu a:active {
background: #ffcc33;
border: 1px solid #ffcc33;
color: #990066;
}
#sousmenu
{
background-color: #333399;
width: 160px;
height: 100%;
list-style: none;
}
#sousmenu li
{
margin: 0 30px;
margin-bottom: 5px;
}
#sousmenu a
{
margin: 0 2px;
width: 100px;
height: 20px;
display: block;
text-align: center;
border: 1px solid gray;
text-decoration: none;
color: #99cc33;
background: #333399;
}
#sousmenu a:hover
{
background: #99cc33;
border: 1px solid #333399;
color: #333399;
}
#sousmenu a:active
{
background: #ffcc33;
border: 1px solid #ffcc33;
color: #990066;
}
Est ce qu'un des deux navigateurs ne traite pas correctement mes CSS oubien est ce que c'est moi qui ai fait caomme un pied ?
Autre question: c'est correcte dans IE 6 ?
Merci de votre aide !
( et vive les standards
)
.
.