Margin Top が CSS のインライン要素で機能しないのはなぜですか?

Margin Top 要素と Inline Elements

CSS では、margin プロパティは要素の境界線の外側の間隔を定義するために使用されます。ただし、特に Firefox でインライン要素でマージン トップを使用する場合、一般的な問題が発生します。

問題:

インライン要素でマージン トップが無視されるように見えるのはなぜですかFirefox では?

答え:

この動作これは Firefox に限定されたものではありませんが、CSS 2.1 仕様で定義されています:

マージン プロパティに関する CSS 2.1 仕様:

「垂直マージンは、非インラインで置き換えられた要素。"

説明:

テキスト、 タグ、 などのインライン要素。タグには高さと幅が定義されておらず、通常は 1 行のコンテンツとして表示されます。 Margin top は垂直マージンのプロパティで、インライン要素の上にスペースを作成しようとします。ただし、インライン要素にはマージンを収容できる高さがないため、無視されます。

結論:

CSS 仕様に従って、マージン上部は適用されません。インライン要素。インライン要素の上に垂直方向のスペースを追加するには、line-height や padding-top などの他のオプションの使用を検討してください。

以上がMargin Top が CSS のインライン要素で機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。