css div 换行问题
0
[待解决问题]
这是我页面的几个div
<div class="top1"><div class="top1-1">
<div class="top1-1a">用户名：</div>
<div class="top1-1b"><input type="text" id="username" name="username" class="bd1"></div>
<div class="top1-1a">密 码：</div>
<div class="top1-1b"><input type="password" id="password" name="password" class="bd1"></div>
<div class="top1-1c"><input type="image" src="images/top-02.gif"></div>
</div></div>
这是几个css
.top1{ width:948px; border:solid 1px #EBEBEB; height:29px;word-break:break-all;}
.top1-1{ height:27px; background-image:url(http://i0.cnfolimg.com/uploads/v5.0/gold/top-01.gif); margin:1px; padding:0px 8px 0px 10px;}
.top1-1a{ float:left; padding:7px 0px 0px 0px; text-align:left;}
.top1-1b{ float:left; padding:3px 10px 0px 0px; text-align:left; width:110px;}
.top1-1c{ float:left; padding:3px 10px 0px 0px; text-align:left;}
.top1-1d{ float:right; padding:7px 0px 0px 0px; text-align:left;}
在ie6下div换成了几行在其他浏览器是正确的在同一行显示，
那位高手帮忙看一下，谢了
所有回答(6)
0
随便说说，在float前面加display: inline试试
不可以~。不过还是谢了~
0
你说的“在ie6下div换成了几行在其他浏览器是正确的在同一行显示” 在我的IE6下并没有出现。我看到的所不一样的一个比较明显的地方是因为.top1-1b{ float:left; padding:3px 10px 0px 0px; text-align:left; width:110px;}这句里边你加了一个宽度，去掉即可。其它也有不一样的地方，没有做好兼容。 另外你的样式写的重用率很低。
0
给每个div设置宽度
0
给每个div设置宽度，正解。。
建议不要用这么多的div，因为你这些元素都是放在form表单里面吧，直接用ul li就差不多了
0
浮动太多，容易产生兼容性问题，用ul 布局
<ul>
<li><label>用户名：</lable><input type="text" id="username" name="username" class="bd1"></li>
<li><label>密 码：</label><input type="password" id="password" name="password" class="bd1"></li>
<li><input type="image" src="images/top-02.gif"></li>
</ul>
这样写 结构比较清晰点。
0
这是窗口大小问题吧……你把浏览器大小改一下div仍会变，我觉得可以再这些div外面套一个div并设置其长宽，然后再设置内部div长宽时适当流出大约10px的宽度，应该就没问题了
