Re,
#menu
{
float: left;
}
.element_menu
{
margin: 0 0 100px 0;
padding:0;
background-image:url("images/menu.png");
background-position:top left;
background-repeat:no-repeat;
list-style-type:none;
}
.element_menu li{
margin: 0 0 100px 0;
padding:0;
}
.element_menu li a
{
margin:0;
padding:0;
display:block;
width:140px;
height:120px;
visibility:hidden;
}
.accueil{
background-image:url("images/accueil.png");
background-position:top left;
background-repeat:no-repeat;
}
.forum{
background-image:url("images/forum.png");
background-position:top left;
background-repeat:no-repeat;
}
.membres{
background-image:url("images/membres.png");
background-position:top left;
background-repeat:no-repeat;
}
mais en utilisant le html suivant :
<div id="menu">
<ul class="element_menu">
<li class="accueil"><a href="index.html">Accueil</a></li>
<li class="forum"><a href="page2.html">Forum</a></li>
<li class="membres"><a href="page3.html">Membres</a></li>
</ul>
</div>
si tu utilises des images qui sont purement décoratives il faut les placer en image de fond d'un fond existant. <img> est réservée aux images qui font parties du contenu de la page, là encore, une question de sémantique !
-;o)
essaie ce code, il devrait passer, mais il faut vérifier qu'il prenne la bonne dimension…
comme ça tu as un menu graphique (joli à voir) mais qui peut aussi être affiché par un navigateur texte et il devient donc accessible à tous, tout le temps (un peu plus en tout cas !).
[ Mathieu ]
Il y a surement des pandas pour ne dépendre de rien
Css afficher image
