如何让三个DIV始终显示在一行

西桥浪子 楼主

三个DIV用float:left组织显示在一行中，当到达边界时其中的div会自动换行，但我想让三个div强制一起换行，该如何实现？
三个DIV中两边的两个都只有2px的宽，中间的那个是根据text自动伸缩的，在三个div外还套了一个DIV，我俯给white-space: nowrap;  display: block;但是不起作用

sdts

<style>
#a {
        width:20px;
        border:1px solid;
        display:inline;
}
#c {
        width:20px;
        border:1px solid;
        display:inline;
}
#b {
        width:2000px;
        border:1px solid;
        display:inline;
}
</style>
<div nowrap="nowrap">
        <div id="a">&nbsp;</div>
        <div id="b">&nbsp;</div>
        <div id="c">&nbsp;</div>
</div>

sdts

修改一下
<style>
#a {
        width:20px;
        border:1px solid;
        display:inline;
}
#c {
        width:20px;
        border:1px solid;
        display:inline;
}
#b {
        width:100px;/*这个宽度不写的话,会出现对不齐的状况,所以可以写一个最小容许的宽度(原因不明,请高人指教)*/
        border:1px solid;
        display:inline;
}
</style>
<div nowrap="nowrap">
        <div id="a">&nbsp;</div>
        <div id="b">&nbsp;1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</div>
        <div id="c">&nbsp;</div>
</div>

还有就是这个在firefox下不行,不知道为什么

西桥浪子 楼主

谢谢楼上的，问题解决了，我原先给三个div赋予float:left属性，看来是错在这里，应该用dispaly:inline赋予内联属性

sdts

再来一个试试

<style>
#a {
        width:20px;
        border:1px solid;
        float:left;
}
#c {
        width:20px;
        border:1px solid;
        float:left;
}
#b {

        border:1px solid;
        float:left;
}
div {
        word-break:break-all;
        word-wrap:break-word;
}
</style>
<div>
        <div id="a">&nbsp;fdsafasdfsdfasdfdsffdsfsdfsdfsfsdfd</div>
        <div id="b">&nbsp;1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</div>
        <div id="c">&nbsp;</div>
</div>

sdts

不用谢 我也还在学习中

Alawn

为什么不用一个DIV，然后加个左右margin？