Listes à puces et élément en float

Lorsque l’on veut mettre une liste à puces à côté d’un élément en ‘float:left’, bien souvent on s’arrache les cheveux… :
les puces sont en effet décalées sur la gauche.

Mettre les puces en ‘list-style-position:inside’ permet de régler le problème mais du coup lorsque l’on retourne à la ligne, le texte n’est plus décalé et se retrouve en dessous de la puce.
On peut donc mieux faire !

En fait, il existe une astuce css : il suffit de mettre les puces en ‘overflow:hidden’ et le tour est joué !

On y pense rarement mais en effet la propriété overflow peut vraiment être utile.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *