[RÉGLÉ] Puces d'une liste, et image en float ??

[bagou01]

Bonjour.
comme visible sur cette page :http://audreybeta.regiscoque.com/par...biobeauty.html
je bloque pour trouver comment gérer les puces images d'une liste, quand le texte se trouve à droite d'une image en float....
j'ai même carrément les images de puce à gauche de l'image parfois, et là je sèche vraiment... y a t il une astuce connue pour ce genre de soucis?
dans l'exemple que j'ai donné,on voit que la puce est collé à l'image, malgré le margin de celle ci...

[lefabdu51]

Re : Puces d'une liste, et image en float ??

il faudrais que tu sortes ton image de la balise H2 ou elle est. dans ton editeur, met ton image et seulement apres ton titre h2.
La, la structure du code est <h2><img></h2>.
<ul>
<li></li>
</ul>
Et la ta liste occupes le meme espace que ton image. Elle s appuies sur le bord gauche de ton image et pas sur le droit.
Alors que ce serais plus logique d avoir <img><h2></h2>
enfin c est mon avis....

Pour info: ligne 248 du fichier template.css
Le conteneur ul associé a ta liste qui te premettras de bouger l ensemble de ta liste
#content ul {
padding-left: 20px;
}
et a la ligne 253, le selecteur qui caractèrise chaque élément de la liste
#content ul li {
list-style-image: url("../images/bullet.png");
}

autrement, tu met une balise div autour de ton image avec une largeur de 20%
et une autre balise div avec une largeur de 79%
20+ 79=99% normalement si c est en float ca doit se coller a coté

Ce ne sont que des pistes mais c est ce que je vois avec firebug.....

[bagou01]

Re : Puces d'une liste, et image en float ??

super merci beaucoup ! !
je teste ça direct !

[Eddy.vh]

Re : Puces d'une liste, et image en float ??

Bonjour.
Sinon, deux autres possibilités puisque finalemnet l'image peut bien être un titre de niveau h2 !
Donner une classe à la liste en question et lui donner un margin-left de 280px dans une feuille de styles.
Si la liste appartient à un article, donner le style dans l'HTML

<ul style="margin-left:280px;">
<li></li>
<li></li>
<li></li>
</ul>