Bonjour,

En HTML 5, dans une liste toute simple, ul/li, j'ai remplacé la puce dans ul par une image icône de 20px x 20px que j'ai recadrée en hauteur 20px x largeur 14px.

Dans les recherches j'ai trouvé quelques astuces mais pas évidentes.

Est-ce possible de dimininuer l'espace entre le bord image et le texte ? Il me semble qu'avec les puces ce n'est déjà pas possible. Désolé, je ne peux pas mettre d'exemples.

Merci de vos réponses.

Salut

Avec un code et surtout un visu c'est plus sympa ....Bon, ta solution passera par déjà en css par:

ul {list-style-type : none; }

Qui va supprimer tes puces...

Ensuite si tu as la ma même image devant tes li, tu peux faire ceci (je décompose)

li{background-image: url(monimage.gif) no-repeat; background-position: 0 10px;padding-left: 5px}

Donc j'ai mon image, une seule fois, positionnée à la hauteur du texte décalée de 5px ...

Par contre si tu as plusieurs images, tu devras utiliser une class pour chaque image

li .image_1, li .image_2, etc..

Bonjour Dreamer,

Quelle coïncidence, à voir l'heure de ta réponse, je viens juste de me connecter d'un autre endroit.

Merci de ta réponse.

J'avais vu cette astuce mais j'ai pataugé malgré mes tests et je pourrai tester que demain a-midi.
Je te fais confiance car tes réponses sont toujours très claires ainsi que le groupe de spécialistes

L'image est un ? uniquement devant le 1er li.

J'ai pourtant recadré l'image en largeur car une liste "normale" il y a toujours un espace avec la puce et je suppose que cet espace doit rester inchangeable. Par rapport à une puce, l'espace avec l'image est plus grand, pas de beaucoup mais si je peux resserrer un peu ce sera mieux.

Bonne soirée !

Les ul n'ont pas d'image, seules les li peuvent en avoir une !!

Comme je le disais (mauvaise explication de ma part), si tu utilises une image en background et non une puce, tu peux la positionner comme voulu, c'est l'avantage.

J'ai modifié ma réponse entre temps. Effectivement, pas les ul mais les li.

Pas de problème, j'utilise une feuille CSS.

D3542 a écrit :

Une autre question stp, peut-on mettre une class à une balise ul et li ?

Oui.

Bonjour et merci elle,

Heureusement que tu me cites car je me suis aperçu de ma question idiote et j'ai modifié. Il y a des moments comme ça.. enfin je commence à me demander si ce n'est pas permanent

Alors, c'est résolu? On peut voir?

elle a écrit :

Alors, c'est résolu? On peut voir?

Toujours aussi curieuse !!

Non, intéressée...

elle a écrit :

Non, intéressée...

Kif-kif !!

Les curieux

Super !

Sans background-position: 0 10px; l'image est centrée en hauteur (pas désagréable à voir) et avec background-position: 0 10px; je n'ai pas réussi à remonter l'image, j'ai essayé plusieurs valeurs.
Dand li j'ai mis un padding-top:1px; et voilà ce que ça donne dans IE 10 (W 7) : faudra que je teste avec FF et Google. IE 8 je l'ai sur un autre PC de tests.

Merci encore à vous !

Je met en résolu mais je pense qu'il y aura des commentaires

Faudrait que je pense à aller manger.