float:left
在 chrome 和 ie7 中表现不同,如 this fiddle 所示和下面的 ascii-art:
IE7 可以,
<-width->
Col1 Col2
text # #
# #
# #
代替
<-width->
Col1
text
col2
# # # # #
#
有没有办法在所有浏览器中获得 ie7 行为?
换句话说,除非页面非常窄,否则不要堆叠 col1 和 col2。目标是拥有一个“超流畅”的两列布局,其中 col1 适合其内容,而 col2 使用窗口的剩余宽度并包装其内容,或者如果不能放在 col1 旁边则显示在 col1 下方。
在回答和评论反馈后重写以更精确。
最佳答案
我仍然无法理解您的需求和问题所在。我将只发布一个答案,你可以在我们进行时记下这些想法。
尝试 1:
您需要至少在其中一列上设置宽度。
试试这个,然后告诉我它有什么问题。 http://jsfiddle.net/LpkQX/27/
尝试 2:
将右列 float 到左列内部。现在 column1 只是一个包装器。
关于CSS赋予 float 在容器内的优先权,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5935068/