ホームページ >ウェブフロントエンド >CSSチュートリアル >絶対に配置された Div が親コンテナ内に留まらないのはなぜですか?

絶対に配置された Div が親コンテナ内に留まらないのはなぜですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-11-30 09:43:11557ブラウズ

Why Doesn't My Absolutely Positioned Div Stay Within Its Parent Container?

絶対位置の問題は解決しました

親コンテナ内に div を絶対的に配置しようとしましたが、div が残っていることが判明しましたページの左上隅に固定されています。この配置に使用されるコードは次のとおりです。

<div>

ID が「absPos」の div が親 div 内に配置されることが期待されていましたが、実際の動作では、親 div に配置されることでした。ページの左上。

原因と解決策

この動作の理由は、オフセット親の概念にあります。絶対配置の要素は、同様に配置される最も近い祖先であるオフセット親を基準とした相対的な位置を取得します。提供されたコードでは、「absPos」 div の祖先がいずれも位置要素ではないため、body 要素からオフセットされています。

この問題を解決するには、親の位置を設定する必要があります。次のコードを使用して、div を「相対」に設定します。

<div>

親 div に「相対」位置を適用すると、位置決めされた要素になり、オフセット親として機能します。 「absPos」divの場合。これにより問題が解決され、親を基準とした「absPos」 div の絶対位置が可能になります。

以上が絶対に配置された Div が親コンテナ内に留まらないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。