親が相対的に配置されていない限り、絶対的に配置されたネストされた DIV では Overflow:hidden が機能しないのはなぜですか?

絶対配置とオーバーフローの隠れた難問

ネストされた DIV を扱う場合、次のような場合に外側の DIV にオーバーフローの隠しプロパティを適用するのは困難になることがあります。絶対的な位置にあるわけではありません。これにより、オーバーフローの非表示動作を無視して、絶対的に配置される内部 DIV が生成される可能性があります。

次の HTML 構造を考えてみましょう。

<div>

ここで、#first にはオーバーフローの非表示プロパティがあり、# 2 番目は絶対的な位置にあります。このシナリオでは、#second はオーバーフロー非表示制約を尊重しません。

#first を絶対位置に設定せずにこの問題を解決するには、次の解決策を検討してください:

1. 位置#first を相対的に:

   #first {
     position: relative;
   }

2. #first の位置を維持絶対的に:

   #second {
     position: absolute;
   }

この設定では、#first のオーバーフロー非表示プロパティに #second が準拠するようになります。これにより、内部 DIV がオーバーフロー制約を遵守しながら、目的のレイアウトを維持できます。

以上が親が相対的に配置されていない限り、絶対的に配置されたネストされた DIV では Overflow:hidden が機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。