Question

3个div如何排列在一行，不换行

Answer 1

<style type="text/css"> .left { float:left; display:inline; } .center{ float:left; display:inline; } .right{ float:right; display:inline; } </style> <div class="left"><div> <div class="center"><div> <div class="right"><div> 页面平铺的时候都是正常的，但页面一缩小，div就换行了。
请大家给点思路！
三个div都设置width 加起来不超过100%
其实很多时候有极端情况中间的一个div必须要固定死
<style type="text/css"> .left { float:left; display:inline; width:45%; } .center{ float:left; display:inline; width:30%; } .right{ float:right; display:inline; width:25%; } </style> <div style="width:100%;height:100%"> <div class="left"><div> <div class="center"><div> <div class="right"><div> </div> 或者宽度是300px，200px，auto这样的固定长度。。。 问题补充：antiwise 写道你要动态调整3个div的宽度 用这个
<div style="width:100%;" id="outer">
<div class="left"></div>
<div class="center"></div>
<div class="right"></div></div><script type="text/javascript"> (function _w(){ var outer=document.getElementById('outer'); var w=outer.offsetWidth; var cw=outer.childNodes[1].offsetWidth; var mlrw=w-cw; if(mlrw<0)return; outer.childNodes[0].style.width=outer.childNodes[2].style.width=Math.floor(mlrw/w*50)+'%'; })(); window.onresize=_w; </script> 中间那个div给个固定长度我的第一个div和第三个div里面有图片，都有最小宽度的。
假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。
也就是如果我把最外层的div宽度固定死，比如960px，就不会发生这样的问题。
但是如果定义成100%，最外层div下面的第二个div的宽度却是固定的，当我页面缩小时，没有足够的空间可供它浮动，所以就跳到下一行了。。。