float:left&float:right divs之间的CSS自适应容器

Question

我正在寻找一种方法让CSS(3)能够自动调整float:leftdiv和float:rightdiv 之间的中心容器div的宽度.

中心div还需要具有一min-width组的功能,类似于谷歌+ - >主页,其中中心内容自动安装在左侧导航按钮和右侧聊天窗格之间.然后,当屏幕宽度缩小超过某一点(使用javascript检测)时,聊天窗格最小化以节省空间.

这是一个活跃的模拟工作:http://jsfiddle.net/9vrby/

另外,这是我现在使用的css代码:

#left{ float:left; width:200px; height:400px; border:1px solid #000; }

#center{ float:left; width:auto; height:400px; border:1px solid red; }

#right{ float:right; width:100px; height:400px; border:1px solid blue; }

如果您需要更多信息,请告诉我,并提前感谢您的帮助.

Answer 1

打开#center,删除float: left和添加overflow: hidden.此外,#center需要在HTML中移动到最后.

http://jsfiddle.net/thirtydot/9vrby/14/

这适用于所有现代浏览器甚至IE7.