コンテンツをテキストは左揃えで中央寄せしたいとき、これまでラッパーとしてdiv等で囲み、flexを使ったり、幅を決めてmargin: 0 auto;を使ったりしていました。
しかし、もう少し簡単にできる方法があったのでご紹介します。

これまでのやり方例

<div>
    <ul>
        <li>Sea sit et duo</li>
        <li>Labore velit enim gubergren</li>
        <li>Duo kasd amet clita</li>
        <li>Eirmod takimata est possim</li>
        <li>Nobis sed sed justo</li>
        <li>Clita sit erat iriure</li>
    </ul>
</div>

ラッピングしたdivにflexを設定

div {
    display: flex;
    justify-content: center;
}

gridでも同じようなレイアウトにできます。

div {
    display: grid;
    justify-content: center;
}

div等でラッピングせずにやる方法

<ul>
    <li>Sea sit et duo</li>
    <li>Labore velit enim gubergren</li>
    <li>Duo kasd amet clita</li>
    <li>Eirmod takimata est possim</li>
    <li>Nobis sed sed justo</li>
    <li>Clita sit erat iriure</li>
</ul>

ulをコンテンツの幅で表示するようにし、中央寄せにする

ul {
    max-inline-size: max-content;
    margin-inline: auto;
}

表示結果

IE以外のブラウザは対応しているようなので問題なく使用できると思います。

justify-content – CSS: カスケーディングスタイルシート | MDN

上下左右中央揃え

上下左右共に中央揃えしたいときはplace-contentを使います。

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}
div {
    display: grid;
    place-content: center;
    height: 100%;
}

表示結果

place-content – CSS: カスケーディングスタイルシート | MDN