ホームページ > ウェブフロントエンド > CSSチュートリアル > 子 Div のマージンがボーダーレスな親 Div の高さに影響を与えないようにするにはどうすればよいですか?

子 Div のマージンがボーダーレスな親 Div の高さに影響を与えないようにするにはどうすればよいですか?

Susan Sarandon
リリース: 2024-12-01 09:12:11
オリジナル
757 人が閲覧しました

How Can I Prevent a Child Div's Margin from Affecting a Borderless Parent Div's Height?

CSS: マージントップとボーダレス親 Div

説明したシナリオでは、子オレンジ div は 30 ピクセルの上マージンで設定されています。上部の境界線がない緑色の親 div。この問題は、上の境界線が望ましくない場合でも、マージンによって親 div が下に押し下げられる場合に発生します。

これを解決するには、境界線のない親 div を維持しながら、次の実装を検討してください:

.body {
    overflow: auto;
}
ログイン後にコピー

親 div ".body" に "overflow: auto" を追加すると、ブラウザーのマージン縮小動作が呼び出されます。これにより、子 div の上マージンを、境界を越えることなく親 div 内に含めることができます。

このアプローチにより、マージンの崩壊を防ぎながら緑色の div がボーダーレスのままになり、オレンジ色の子 div を適切に配置できるようになります。親 div の高さに不要な変更を引き起こすことなく。

以上が子 Div のマージンがボーダーレスな親 Div の高さに影響を与えないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート