0

私はこれに対する答えを求めてサイトを検索しましたが、私が見ることができることから、他の質問には親がdiv使用しているものは含まれていませんposition:absolute;

これが私のコードです：

<div id="wrapper">

    <div id="child">
    Here are the contents to be displayed.
    </div>

</div>

ここに私のCSSがあります:

#wrapper {width:1024px; height:auto; position:absolute; top:0px; left:0px; border:solid 1px #000;}

#child {width:500px; height:1000px; position:absolute; top:35px; left:15px; border:solid 1px #FF0000;}

ここにフィドルがあります：jsfiddle

4

2 に答える 2

1

親が相対的にできない場合、子は相対的でなければなりません (同じ動作が得られます)。両方が絶対的な場合、それらは関連していないため、親は子に適応できません (またはその逆)。また、親に padding-bottom を追加して、子のフル サイズにパッチを適用する必要があります (少なくとも子の上部 + 必要なパディング)。

フィドルを例で更新: http://jsfiddle.net/aEbFv/8/

#wrapper {
    ....
    padding-bottom: 60px; /* 35px from childs top + 25px for padding */
}
#child {
    ....
    position:relative;
}
于 2013-04-16T11:12:11.893 に答える
0

今すぐ与える

    #wrapper{
position:relative;
position:absolute; // remove this line
}
    .child{
    position:absolute;
    left:0;
    right:0;
    width:500px; // remove this line
    }

常に親 div position relativeと子 divに与えるabsolute

位置の詳細

于 2013-04-16T11:08:07.140 に答える