幅が不明なインラインブロック要素を中央に配置するにはどうすればよいですか?

インライン ブロック要素の中央揃え

コンテナ要素の text-align プロパティを使用して、インライン ブロック要素を中央揃えにすることができます。

問題ステートメント

CSS を使用して幅が不明なインラインブロック要素のスタイルを設定する場合、自動マージンを使用した従来の中央揃え方法は機能しません。固定幅を設定することも、要素が適切に強調表示されなくなるため、実行可能なオプションではありません。

解決策

幅が不明なインライン ブロック要素を中央に配置するには、 text-align: center; を設定するだけです。親コンテナ上で。これにより、要素がコンテナ内で水平方向に中央に配置されます。

例

次のコードを考えてみましょう。

.container {
  text-align: center;
}

.equation-element {
  display: inline-block;
}

このコードは方程式を中央に配置します。幅に関係なく、コンテナ内の要素。

デモ

[ライブ デモ](https://example.com)

以上が幅が不明なインラインブロック要素を中央に配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。