Comment centrer une liste non ordonnée sans utiliser de divisions parents ?

Centrage d'une liste non ordonnée sans wrappers parents

Cette question aborde le défi de centrer une liste non ordonnée (

) sans s'appuyer sur un élément div parent. L'objectif est de préserver l'alignement à gauche dans les éléments de la liste (
• ).

  Solution :

  Le code CSS suivant centre efficacement la liste tout en conservant l'alignement à gauche pour les éléments de la liste :

  ul {
    display: table;
    margin: 0 auto;
  }

  Explication :

  Paramètre d'affichage : table transforme la liste en tableau, ce qui lui permet de remplir la largeur disponible. La marge : 0 auto propriété centre automatiquement le tableau, et donc la liste, sur la page.

  Exemple :

  <code class="html"><ul>
    <li>56456456</li>
    <li>4564564564564649999999999999999999999999999996</li>
    <li>45645</li>
  </ul></code>

  Conclusion :

  Cette solution répond au besoin de centrer une liste non ordonnée sans créer de wrappers supplémentaires dans le HTML. En utilisant les propriétés automatiques display: table and margin: 0, il aligne la liste horizontalement au centre tout en conservant l'alignement à gauche de ses éléments.

  Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!