Suppression de l'indentation d'une liste non ordonnée avec CSS

Lorsque le texte d'une liste non ordonnée revient à la ligne, des retraits indésirables peuvent apparaître. Pour résoudre ce problème, essayez les étapes suivantes :

1. Supprimer l'indentation

Supprimer le remplissage par défaut et le retrait de style liste :

ul {
    padding: 0;
    list-style-type: none;  
}

2. Diminuer la hauteur de la ligne

Si nécessaire, réduisez la hauteur de la ligne en la définissant égale à la taille de la police, ou légèrement inférieure :

ul li {
    line-height: 1em;
}

3. Désactivez Float

Supprimez toutes les propriétés float appliquées aux éléments de liste, en vous assurant qu'ils affichent plutôt le bloc en ligne :

ul li {
    float: none;
    display: inline-block;
}

4. Ajuster la taille de la police

Enfin, ajustez la taille de la police à l'apparence souhaitée.

Exemple

Considérez le code suivant :

#info {
    ...
}

#info ul {
    padding: 0;
    list-style-type: none;
}

#info ul li {
    float: none;
    display: inline-block;
    line-height: 1em;
}
Cette combinaison de techniques devrait éliminer l'indentation des lignes renvoyées à la ligne dans les listes non ordonnées, garantissant ainsi une apparence propre et professionnelle.