絶対配置されたDIVが親の幅を継承しないのはなぜですか？ DIVは、DIVは、その内容の長さと同じ長さであり、絶対に、DIVの幅をすべての利用可能なスペースを取る静的位置決めを絶対配置されたDIVが親の幅を継承しないのはなぜですか？
div {
position: absolute;
top:100px;
}
<html>
<body>
<div>This DIV</div>
</body>
</html>
を有しています。
divのデフォルトの幅はautoです。それは自動的に内部のコンテンツの幅です。親からの幅を継承しません。これを行うには、divの読み取り@DaniPのドキュメントが答えのリンク
div {
position: absolute;
top:100px;
width: inherit;
}
は動作しませんでしたが、divの幅はまだ内容の幅です。 – MezzanineLearner
ボディの幅を設定する必要があり、継承します... divを別のdivにラップし、その幅を設定します。ボディーのデフォルト幅もautoです。 –
私はフルサイズの親としてhtmlを使用しています。身体の幅は今でも100％です。 – MezzanineLearner
の幅に継承を指定する必要があります。
スタイルの幅を追加します。その親
#divParent{
width:300px;
}
#divAbsolute {
position: absolute;
top:100px;
background:red;
width:inherit;
}<html>
<body>
<div id="divParent">
<div id="divAbsolute">This DIV</div>
</div>
</body>
</html>これは親から継承されません、あなたは親の幅が100％であると仮定しています。 – MezzanineLearner
正しい。私は気を散らした –
の幅を継承するために継承し、絶対配置要素はブロックレベル要素として振る舞わないとお互いなどの後に流れないので通常はdivが行います。
これは言うことになった。 divをその親の幅にしたい場合。親の位置をrelativeに設定し、絶対的な要素をwidth：100％に設定します。 –
https://www.w3.org/wiki/CSS_absolute_and_fixed_positioning#Specifying_dimensions – DaniP
Danip私はリンクを読んで、私のdiv祖先は幅がなぜフルスクリーンでhtmlです：私のdiv CSSの継承します動作しません？説明してください。 – MezzanineLearner