要素Dは、要素Bを置く、およびC

Question

ていないのはなぜここで私はレンダリングするページです。ここで

ソースコードです：

<div id="a"> 
</div> 
</div id="b"> 
</div> 
<div id="c"> 
</div> 
<div id="d">about 
</div> 

は、

もCSSファイル：

#a{ 
    background-repeat:no-repeat; 
    background-position:center; 
    height:120px; 
    background-color:green; 
} 

#b{ 
    background-image:url('resources/weneedu.png'); 
    background-repeat:no-repeat; 
    background-position:center; 
    width:40%; 
    height:340px; 
    position:absolute; 
    left:10% 
} 

#c{ 
    background-image:url('resources/yunoguy.png'); 
    background-repeat:no-repeat; 
    background-position:center; 
    width:40%; 
    height:340px; 
    position:absolute; 
    left:52%; 
} 

なぜ要素Dは要素Aの下を移動し、要素Bのままになりますか？興味深いことに、面白いことに、これはC、Bの前に移動します。

また、私は次のようなことをしたいと思いますか？ありがとう。

Answer 1

position: absoluteは、自然な流れから要素を削除します。代わりにposition: relativeを使用して、これがあなたの好きな場所に届くかどうかを確認してください。

なぜ同じ位置に#dを配置しないのですか？