CCS では、margin-bottom は本当に無効ですか? _html/css_WEB-ITnose

たとえば、上の画像の文字を下に表示したいのですが、タイトルが 2 行になる場合があるため、margin-top を設定しても、確かに問題を一度に解決することはできません。

次の部分と似ています:

<div>   <p>巴萨憾负塞尔塔，梅西哭晕在厕所。</p></div>

ディスカッションへの返信（解決策）

この属性の意味を誤解しています。これは、設定した要素の下マージンを指しますが、親要素の下部にあるという意味ではありません。また、すべての子要素が親要素の最後に表示されるという意味でもありません。あなたが言ったような場合、絶対位置を使用してbottom:0を設定した場合にのみ機能します。

margin-bottom は機能します。私は何度も使用しています。

この属性の意味を誤解しています。これは、設定した要素の下部マージンを指しますが、それが要素の下部にあるという意味ではありません。親要素のすべての子要素がその下部に表示されるわけではありません。あなたが言ったような場合、絶対位置を使用してbottom:0を設定した場合にのみ機能します。

たとえば、2 つのボックスを上から下に配置する場合、最初のボックスに margin-bottom:10px を設定すると、2 番目のボックスは最初のボックスから 10 ピクセル離れた位置に配置されます。 set margin-bottom:10px 0の場合、最初のマージンの隣になります（もちろん、2番目のマージントップも0に設定されます）。同じレベルです。親要素内での位置は設定しません。

それは機能しますよね?

たとえば、2 つのボックスを上から下に配置する場合、最初のボックスに margin-bottom:10px を設定すると、2 番目のボックスは離されます。最初のボックスは 10px に設定すると、最初のボックスの隣になります (もちろん、2 番目のボックスの margin-top も 0 に設定されます)。これは要素間の間隔を設定するためです。親要素内での位置を設定するのではなく、同じレベルの。

それはうまくいきますね