Bonjour,
J'ai repris le CSS qui se trouve ici http://www.alsacreations.com/static/modelesmenus/g02.htm.
Il est parfait. Je l'ai modifié pour l'adapter à mes besoins. Jusque là, pas de soucis.
Toutefois quand je teste dans IE, il n'y a aucun soucis. Par contre sur Firefox, je ne vois pas les images du menu quand je n'y suis pas et il n'est plus centré.
Quelqu'un a-t-il une idée ?
Voici le code :
Et pour que cela soit plus simple, c'est là : http://www.ac-nice.fr/tocqueville/pageaccueil2.htm
Si quelqu'un peut m'aider, ce serait très gentil....
Modifié par 70156 (02 May 2009 - 16:37)
J'ai repris le CSS qui se trouve ici http://www.alsacreations.com/static/modelesmenus/g02.htm.
Il est parfait. Je l'ai modifié pour l'adapter à mes besoins. Jusque là, pas de soucis.
Toutefois quand je teste dans IE, il n'y a aucun soucis. Par contre sur Firefox, je ne vois pas les images du menu quand je n'y suis pas et il n'est plus centré.
Quelqu'un a-t-il une idée ?
Voici le code :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Accueil Lycée Tocqueville</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
/* CSS issu des tutoriels css.alsacreations.com */
body {
background: #fff;
text-align: center;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: normal;
font-size: 14px;
}
ul, li { /* utilisation de liste pour le menu */
list-style-type: none; /* suppression des puces de liste */
margin:0;
padding:0;
}
ul {
position: relative; /* positionnement pour IE5 et IE5.5 */
top: 0;
background: url(images/menuaccueil.gif) top left no-repeat; /* arrière-plan général du menu */
width: 360px;
text-align: center;
}
li {float: left;}
li a { /* dimensions et définitions des boutons */
display: block; /* mise en block de <a> pour lui donner des dimensions */
height: 420px;
width: 120px;
color: #fff;
font-size: 14px;
line-height: 50px; /* hauteur de ligne pour éviter les paddings */
font-weight: bold;
font-family: arial, serif;
text-decoration: none;
}
li a:hover {
background: transparent url(images/menuaccueil.gif) top left no-repeat;
}
a#lien1:hover {
background-position: -360px 0%; /* décalage de l'arrière-plan pour chaque bouton */
}
a#lien2:hover {
background-position: -480px 0%;
}
a#lien3:hover {
background-position: -600px 0%;
}
/* mentions et copyright */
div#mentions {
font-family: verdana, arial, sans-serif;
position: absolute;
bottom : 200px;
left : 10px;
width: 400px;
margin: 1em;
padding: 0.5em;
background: #FFF7D2;
line-height: 1.1;
font-size: 0.9em;
}
div#mentions a {
text-decoration: none;
color: #FFF;
}
div#mentions a:hover {
text-decoration: underline;
color: white;
}
.web {
font-size: 10px;
}
-->
</style>
<body>
"
<em>Dans les démocraties, chaque génération est un peuple nouveau.</em>" Alexis de Tocqueville
<ul>
<li><a id="lien1" href="actuadmin.html"></a></li>
<li><a id="lien2" href="actupedagogie.html"></a></li>
<li><a id="lien3" href="actuclub.html"></a></li>
</ul>
<span class="web">
Mise à jour du site le 13 avril 2009 - Webmaster : <a
href="mailto:gino.nocera@ac-nice.fr">M.Nocera </a>
</span>
</body>
</html>Et pour que cela soit plus simple, c'est là : http://www.ac-nice.fr/tocqueville/pageaccueil2.htm
Si quelqu'un peut m'aider, ce serait très gentil....
Modifié par 70156 (02 May 2009 - 16:37)
