「display: table」を使用せずにコンテンツコンテナを水平方向に中央揃えにするにはどうすればよいですか?

表示の中央揃え: inline-block

サイドバーとコンテンツ コンテナで構成されるレイアウトの目的は、コンテンツを水平方向に中央揃えにすることです固定幅を使用せずに。 display: table を使用するとこれが実現されますが、これは推奨されません。この記事では、display:inline-block を使用した代替ソリューションを検討します。

コンテンツを中央に配置するには、次の CSS を適用できます。

body {
    text-align: center;
}

.wrap {
    display: inline-block;
}

この変更では、display: table が削除されます。 。包む。さらに、text-align: center が body に追加され、コンテンツが利用可能な水平方向のスペース内で中央に配置されるようになります。

この代替メソッドは、display:table を必要とせずに、目的の中央揃え効果を実現します。これは、さまざまなレイアウト シナリオに適応できる、より単純で柔軟なアプローチです。

以上が「display: table」を使用せずにコンテンツコンテナを水平方向に中央揃えにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。