IE7 div框清晰:右边和浮动:左边 - 浮动到顶部

时间:2010-04-08 18:39:18

标签: css internet-explorer-7 css-float clear

最近我一直在我的桌子上猛击头来解决这个问题。没有成功。我知道可以通过使用一些清除元素编辑内容来解决。遗憾的是,使用了一些javascript排序,而且CMS组件正在生成Sourcode,这将是我的最后一次拍摄。

我有几个箱子连续2个飘出来。盒子有不同的高度,但宽度相等,都放在一个静态宽度的容器中。该链接显示了我需要重现问题的来源。我的盒子正在向左浮动。我试图用清楚的方法解决这个问题:左边是奇数而且是明确的:右边是偶数元素。但这只适用于ff / ie8 / chrome浏览器,而不是ie7。

示例:http://www.i3rutus.de/ie7divfloatexample/

任何人都知道通过编辑CSS而不是实际的XHTML来解决这个问题的可能性?问题出现在IE7中。 IE8,Chrome和FF工作正常。

任何想法?

提前致谢

3 个答案:

答案 0 :(得分:0)

如果您能够在标题中包含js,那么可以尝试使用http://code.google.com/p/ie7-js/吗?

我玩了它但是给了浮动:右边拧起来,它可能比试验浮点值复杂一点。

- 更新 -

我似乎能够通过以下方式让它在ie7中运行:

删除float:left on .clear, 添加了float:left; margin-top:0px到.even

答案 1 :(得分:0)

只需删除

.even {
    clear: left;
}
.odd {
    clear: right;
}

它按预期工作。

答案 2 :(得分:0)

这是交易。您只需要浮动每对盒子中的一个。这是修改后的css规则:

  .even {
  float: left;
  clear: left;
  margin-top: 0
  }

  .odd {            
  }

Demo

(顺便说一句,你使用奇数甚至让我追逐我的尾巴一段时间;))