div低于父div (css)。

Question

所以还有一个问题。

为什么带有phone#图像的div低于父div？我试过了。帮不上忙。我试过绝对定位父母的“照片”，但它把所有东西都扔到左边。看这里

<div id="angies"></div>
<div id="est"></div>
<div id="pics">
<div id="logot"></div>
<div id="house"></div>
<div id="phone"></div>
</div>

#angies {height:124px;
width:347px;
margin-right:0px;
margin-top:0px;
float:right;
background-image: url(images/ang.jpg);
background-repeat:no-repeat;}

#est {height:16px;
width:165px;
margin-left:5px;
    margin-top:5px;
background-image: url(images/est.jpg);
background-repeat: no-repeat;}

#pics {height:175px;
width:878px;
border:1px solid;
margin-left:auto;
margin-right:auto;}

#logot {height:169px;
width:360px;
border:1px solid;
float:left;
margin-bottom:0px;
background-image:url(images/logot.jpg);
background-repeat:no-repeat;}

#house {height:169px;
width:166px;
border:1px solid;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
background-image:url(images/house.jpg);
background-repeat:no-repeat;}

#phone {height:43px;
width:312px;
border:1px solid;
position:relative;
margin-bottom:0px;
margin-left:526px;
position:static;
background-image:url(images/phone.jpg);
background-repeat:no-repeat;}

附注：为什么这些div会以0像素的底部边缘到达顶部呢？这一刻我不觉得困扰，但我还是想知道怎么回事。

Answer 1

简单的解决方案是让它们都浮起来:左

#house { float: left; }
#phone { float: left; }