我正在尝试创建一个动态网站,我在旁边有三个浮动框.它们的宽度分别为33.33％.它们周围的容器div宽度为75％.
我在这里找到了一篇关于这个问题的文章：CSS: Jumping columns
我在这里也找到了同样问题的一个例子：Jumping columns example
拖动窗口大小以查看IE7或更早版本中的跳转.
任何人都知道是否有可能解决这个问题？ (没有Javascript)
解决方法
我根据具体情况使用两种不同的解决方案.首先,尝试使用Nicole Sullivan方法(使用overflow：hidden;在行中的最后一个元素而不是float / width)：
http://www.stubbornella.org/content/2009/07/23/overflow-a-secret-benefit/
.container {
width: 75%;
}
.Box1 {
width: 33.33%;
float: left;
display: inline; /* fixes another IE bug */
}
.Box2 {
overflow: hidden;
}
这适用于大多数情况.
如果做不到这一点,我会向最后一个元素添加几个像素的负边距.
.Box2 { width: 33.33%; float: left; display: inline; /* fixes another IE bug */ margin-right: -3px; }
如果最后一个元素向右浮动,只需在左边添加负边距.到目前为止,在少数溢出不适合的情况下,这对我有用.
