28173 sujets

CSS et mise en forme, CSS3

bonjour,

j'ai un pb qui me parait assez délicat. Pour une fois, le rendu est identique sous IE et FX, mais c'est Opera qui déconne. Le but est d'afficher un point qui indique la rubrique active.

body{
margin:0;
padding:0;
}
div{
width:200px;
background-color:#CCCCCC;
}
ul
{
list-style-type:none;
text-align:right;
font-size:13px;
}


<div>
<ul>
<li><a href="#">lien 1</a><img src="img/point.png" style="position:absolute;margin-top:5px;margin-left:5px;" /></li>
<li><a href="#">lien 2</a></li>
</ul>
</div>




FX :
upload/5827-renduFX.jpg

Opera :
upload/5827-renduopera.jpg
Modifié par bill_baroud (16 Aug 2006 - 15:28)
Salut.

Quel est l'intérêt de positionner le point en absolu si tu ne lui indique pas la position à prendre ?

Ce qui m'étonne, c'est que ça fonctionne sous IE et Firefox Smiley ohwell

Pour que ça fonctionne, il faut appliquer un "position: relative;" aux <li>, et ajouter pour l'image "right: 0;".

Il me semble qu'on utilise généralement un id pour désigner le lien de la page active, ce qui permet de lui appliquer un style pour le démarquer des autres liens du menu.
Sopo a écrit :
Salut.

Quel est l'intérêt de positionner le point en absolu si tu ne lui indique pas la position à prendre ?

Ce qui m'étonne, c'est que ça fonctionne sous IE et Firefox Smiley ohwell

Pour que ça fonctionne, il faut appliquer un "position: relative;" aux <li>, et ajouter pour l'image "right: 0;".

Il me semble qu'on utilise généralement un id pour désigner le lien de la page active, ce qui permet de lui appliquer un style pour le démarquer des autres liens du menu.

merci, effectivement en attribuant un left:220px ça va mieux. Je pensais que le margin-left:20px suffisait...