Question

css的div重叠在一起了

页码信息应该显示在最下面，为什么显示在右上角
我打开firebug查看了一下原来页码信息所在的div把图片也包括了

#right_content
{
width:690px; min-height:350px; _height:350px;
float:left; margin-left:10px;
}

.product {margin:10px 10px;height:auto;width:660px;}

.product ul{padding:0 0 0 15px;}
.product ul li{list-style:none; float:left;width:180px;
margin:10px 15px;line-height:20px;
}
.product_pic {border:1px solid #fff;vertical-align:middle;text-align:center;}

.p-name{text-align:left;overflow:hidden; height:40px; word-wrap:break-word;}

.pagefoot{text-align:center; margin:20px auto;
color:#666666;
}

<div id="right_content">
<div class="product">
<ul>
<li>
<div class="product_pic " >
<img src="upload/product1.jpg">
</div>
<div class="p-name"> 商品1 </div>
</li>

<li>
<div class="product_pic" >
<img src="upload/product2.jpg">
</div>
<div class="p-name"> 商品2 </div>
</li>
省略。。。。
</ul>

</div>

<div class="pagefoot">
当前 1 / 2 页    共 7个信息
</div>
</div>

Answer 1

690px宽度里加了一个 660px的容器，660px的容器加了浮动，690px容器还有宽度空间，页面层自然就上去了。解决方式两种：1. 660px改为690px。 2. 清除浮动。

个人偏向于第二种，因为有浮必清。

Answer 2

给你的pagefoot 加上 clear：both 清楚上层带来的浮动

Answer 3

product 和 pagefoot中需要加上float:left