Question

一个父div里面的两个子div 都已经固定宽度设定了float：left浮动了，为什么还是不能在一排上面，请教。

<div id="header">
<div class="logo"><a href="#"><img src="img/logo.png" width="190" height="66" alt="奇乐族网页游戏攻略" /></a></div>
<div class="nav">
<ul>
<li class="cur">
<a href="#" class="spmenu-1">
首页
</a>
</li>
<li >
<a href="#" class="spmenu-2">
游戏攻略
</a>
</li>
<li >
<a href="#" class="spmenu-3">
游戏专题
</a>
</li>
<li >
<a href="#" class="spmenu-4">
游戏战报
</a>
</li>
<li >
<a href="#" class="spmenu-5">
工具下载
</a>
</li>
<li >
<a href="#" class="spmenu-6">
游戏专区
</a>
</li>
</ul>
</div>
<div class="ad_1"></div>
</div>
css样式
body, ul, li, h1, h2, h3, h4, h5, h6, p, form, dl, dt, dd { margin:0px;padding:0px; font-size: 12px; font-weight: normal; }
ul { list-style: none; }
img { border-style: none; }
a { color:#444; text-decoration:none;}
.logo{ float:left; margin:11px 0 11px 5px; width:190px; height:66px;}.logo img{ width:190px; height:66px;}.ad_1{ width:150px; margin-left:10px; float:right;background: #99FF99; height:82px;}
.nav { float:left; height:82px;width:600px;background:transparent url(../img/nav.png) no-repeat scroll 0 0; margin:3px 0 3px 20px;}
.nav ul {float:left;overflow:hidden;height:82px;position:relative;}
.nav ul li {float:left;display:block;position:relative;width:100px;height:82px;}
.nav ul li a {display:block;color:#333;padding-top:60px;height:22px;width:100px;text-align:center;}
.nav ul li a:hover, .nav ul li.cur a {position:absolute;padding-left:1px;top:0;left:-1px;background:transparent url(../img/nav.png) no-repeat 0 -82px}
.nav ul li a.spmenu-1:hover, .nav dd ul li.cur a.spmenu-1 {background-position:0px -82px}.nav ul li a.spmenu-2:hover, .nav dd ul li.cur a.spmenu-2 {background-position:-100px -82px}
.nav ul li a.spmenu-3:hover, .nav dd ul li.cur a.spmenu-3 {background-position:-200px -82px}
.nav ul li a.spmenu-4:hover, .nav dd ul li.cur a.spmenu-4 {background-position:-300px -82px}
.nav ul li a.spmenu-5:hover, .nav dd ul li.cur a.spmenu-5 {background-position:-400px -82px}
.nav ul li a.spmenu-6:hover, .nav dd ul li.cur a.spmenu-6 {background-position:-500px -82px}
.nav ul li a.spmenu-1:active {background-position:0px -164px}.nav ul li a.spmenu-2:active {background-position:-100px -164px}
.nav ul li a.spmenu-3:active {background-position:-200px -164px}
.nav ul li a.spmenu-4:active {background-position:-300px -164px}
.nav ul li a.spmenu-5:active {background-position:-400px -164px}
.nav ul li a.spmenu-6:active {background-position:-500px -164px}
解答的详细的，我追加50分 在DW中没有问题

Answer 1

id="header"的宽度没给出来，你设置的多少，刚刚我算了一下

总宽度是（190+5）+（600+20）+（150+10）=985px，你的 id="header"的宽度必须大于这个值才能在一行显示。

此时多数浏览器下都正常了，IE6下会有双倍浮动的bug，必须将.logo，.nav 的css添加display:inline才能确保IE6下正常

追问

我设定的总宽度是980 但是我把尺寸修改成（190+5）+（600+20）+（145+10）=980px 还是出现不能在一排上面的情况 display：inline我也加上了 还是不行啊

追答

不会吧，我把

ad_1{ width:145px; }之后页面就正常了啊。

你看下是不是设置了边框，padding什么的，如果设置了这些宽度也要算在其中，再就是给.logo，.ad_1，.nav设置overflow:hidden;试下

追问

我自己解决了 只是在head上面加了一个float就型了 不过不管怎么说还是多谢你了！

Answer 2

代码中，父div的宽度小于两个子div了，所以不能在一行显示，父div的宽度要大于两个子div的宽度之和

Answer 3

我把id="header"宽度 （190+5）+（600+20）+（150+10）=975px
在我这firefix ie7 8没问题 ie6换行 将.logo添加display:inline;属性后也变为正常
如果说你将.logo .nav都添加display:inline;属性了还有问题 我能想到的可能性就是那张我这没有的logo.png的图片了 你看下这图片的真实尺寸 然你换张小一点.jpg图片放上去 看看问题是不是出在图片上 如果不是图片 你在将.nav .ad_1做些调整 看看问题是出现在那个区域里

Answer 4

是不是你id为header的div没设固定宽?
你没设固定框随浏览器拉动就换行了.在最外围那个div设个1024px看看

追问

head的宽度是固定的 我觉得可能是position属性的问题 但是具体问题在哪 我就不知道了