Bonjour,
Je fais appel à vos regards neufs pour m'aider à trouver ce qui cloche dans mon menu avec un effet de rollover. (les chiffres blancs deviennent verts au survol de la souris).
http://charlotte.flibuste.net/sites/stefandefago/page2.html
Celui-ci est construit sur une grille de 168 x 81 px, et il comprend 20 liens de 24 x 19 px.
Tout allait pour le mieux jusqu'à ce que je le regarde sous IE windows :
On dirait qu'il agrandit la zone de mes liens. Quand je passe la souris sur un lien ils sont 4 à devenir vert.
Je cherche je cherche, mais je ne comprend toujours pas, et c'est moi qui commence à devenir verte.
Merci de votre aide !
Charlotte
----------------------------------------------------------------
voici le code HTML
voici la css :
Je fais appel à vos regards neufs pour m'aider à trouver ce qui cloche dans mon menu avec un effet de rollover. (les chiffres blancs deviennent verts au survol de la souris).
http://charlotte.flibuste.net/sites/stefandefago/page2.html
Celui-ci est construit sur une grille de 168 x 81 px, et il comprend 20 liens de 24 x 19 px.
Tout allait pour le mieux jusqu'à ce que je le regarde sous IE windows :
On dirait qu'il agrandit la zone de mes liens. Quand je passe la souris sur un lien ils sont 4 à devenir vert.
Je cherche je cherche, mais je ne comprend toujours pas, et c'est moi qui commence à devenir verte.
Merci de votre aide !
Charlotte
----------------------------------------------------------------
voici le code HTML
<div class="menu">
<div class="thumb">
<ul>
<li id="th1">
<a href="../01.html"><span>image 1</span></a>
</li>
<li id="th2">
<a href="../02.html"><span>image 2</span></a>
</li>
[...]
</ul>
</div>
</div>
voici la css :
/*-----------lien thumbnail-------*/
.thumb{
position: absolute;
top:30px;
left: 103px;
height: 130px;
width: 168px;
background: transparent url(../images/thumb.jpg) no-repeat 0px 6px;
}
/*---rollover---*/
.thumb ul{
height: 81px;
width: 168px;
margin: 6px 0 0 0;
padding: 0;
position: relative;
}
.thumb span { visibility: hidden; }
.thumb li {
margin: 0;
padding: 0;
list-style: none;
position: absolute;
}
.thumb li, .thumb a {
height: 19px;
width: 24px;
display: block;
}
/*---ligne 1----*/
#th1 { left: 0px; top: 0px;}
#th1 a:hover {background: transparent url(../images/thumb.jpg) -168px 0px no-repeat;}
[...]