28172 sujets

CSS et mise en forme, CSS3

Bonjour,

pour mes listes j'ai annulé la puce html et remplacé celle ci par une image en background à la balise <li>. Je rencontre 2 problèmes sous IE (7) :

1. Lorsque une image flottante est à gauche de ma liste, l'image des puces est cachée par cette image. Avec Firefox, les puces sont visibles (<li> se décale pour que la puce apparaisse)

2. Impossible de centrer la puce verticalement par rapport aux lettres. Quand c'est bon sous Firefox, c'est trop haut sur IE et quand c'est bon sous IE, c'est donc trop bas sous Firefox...

Des idées ?
Modifié par Newzic (25 Apr 2008 - 13:19)
Hello Smiley smile

a écrit :
1. Lorsque une image flottante est à gauche de ma liste, l'image des puces est cachée par cette image. Avec Firefox, les puces sont visibles (<li> se décale pour que la puce apparaisse)

Besoin d'un peu de code ou au mieux une page en ligne. Que donne le padding ou le margin sur ton image flottante ou sur ton <li> ?

a écrit :
2. Impossible de centrer la puce verticalement par rapport aux lettres. Quand c'est bon sous Firefox, c'est trop haut sur IE et quand c'est bon sous IE, c'est donc trop bas sous Firefox...

Pareil, sans aucune source ça va être dur. Mais en général le positionnement du background fonctionne très bien :

li {
...
background:#fff url(puce.jpg) no-repeat [b]left center[/b]; }


Et si c'est le texte qui ne se centre pas correctement :

li {
...
height:30px;
line-height:30px;}

Modifié par BeliG (25 Apr 2008 - 13:55)