Question

我写了一个div本来是希望文字在div里面。可是现在外面跑到div下面

<div class="div3">
<div class="div6">您的位置：首页 >> 产品展示</div>
<div class="div7">
<div class="div9">
<h2>产品展示</h2>
</div>

<ul>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>
<li><img src="images/default.jpg"/><span><a href="#">点击查看</a></span></li>

</ul>
</div>
</div>
</div>

body{
margin:0 auto;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;}
a{
text-decoration:none;}
.div1{
width:1000px;
maigin:0 auto;
border:1px solid red;
height:500px;}
.div2{
width:220px;
border:1px solid blue;
height:400px;
float:left;
overflow:hidden;}
.div3{
width:780px;
border:1px solid green;
height:500px;
margin-left:220px;
}
.div4{
width:218px;
height:200px;
background-color:#0C6;}
.div5{
width:218px;
height:200px;
background-color:#C06;}
.div6{
height:30px;
border: 1px solid #CCC;
padding-top:10px;
padding-left:15px;}
.div7{
width:770px;
}
.div7 ul{
width:770px;
border:1px solid silver;
padding-left:0px;
margin-top:0px;}
.div7 ul li {
float:left;
list-style-type:none;
margin-left:12px;
margin-top:30px;
width;90px;
height:70px;
border:1px solid silver;}
.div7 ul img{
width:110px;
height:80px;}
.div7 ul li span{
display:block;
margin-top:3px;
text-align:center;}
.div9 {
height:40px;
padding-left:20px;
}
.div9 h2{
color:#6FF;
font-size:14px;
height:15px;
display: block;
float: left;
margin-top: 5px;
font-weight: bold;}

总是把图片压下去。

Answer 1

把.div7 ul li{float:left;list-style-type:none;margin-left:12px;margin-top:30px;width;90px;height:70px;border:1px solid silver;}的height:70px;去掉就行了。

或者是把70px改成100px也可以！！
个人建议用第一种去掉高度

追问

不是我说的是div9 这个里面不是有个字是产品展示吗？产品展示这四个字不在div9里

Answer 2

把.div7 ul li{float:left;list-style-type:none;margin-left:12px;margin-top:30px;width;90px;height:70px;border:1px solid silver;}的height:70px;去掉就行了。
你li的高度还没有它里面的img的高度大，文字当然就跑到外面去了

追问

不是我说的是div9 这个里面不是有个字是产品展示吗？产品展示这四个字不在div9里

追答

在的啊，我几个浏览器测试都在的，你截个图看看，怎么个不在法

追问

真不在。要不我加你QQ.截个图给你看看

追答

1165200053

Answer 3

最好在.div9里边加个overflow:hidden; 清除浮动；