HTML – CSS浮动问题,在IE中工作,在Chrome / FF中不起作用..我可能做错了什么

我不是非常精通CSS ……并且还不知道所有主要的怪癖.也许有人可以帮助我.我已经设置了一个显示我的代码的图像,一个我的DIV图表,以及它在IE和Chrome / FF中的外观示例

有人可以指导我以正确的方式解决这个问题吗?

小提琴:http://jsfiddle.net/PhilippeVay/BuuuW/2/

它在IE中运行良好,但在Chrome和FF中,其中一个图像正在转移其容器,而我所称的“内容块”正在它应该是旁边的图像下面.尽管我的图表说没有css,但每个组件都有一个css类.目前只有一些基本的样式(填充,文本缩进等).

谢谢

最佳答案 添加溢出:隐藏到容器将避免左侧部分继续在右侧图像下方:

.cb {
    overflow: hidden;
}

这将创建一个新的块格式化上下文,我不会向你解释,因为其他人已经做得比我更好:) http://colinaarts.com/articles/the-magic-of-overflow-hidden/

编辑:没有看到person.jpg在左边的父母之外:看到clearfix方法的其他答案:)

点赞