Css Firefox中的列宽和图像包装

在Firefox中使用CSS3

列宽

属性似乎没有达到预期效果。当存在高于其容器的图像时，该图像不会按预期换行到新列上：

---

人们会期望有两列，上半部分在左边，下半部分在图片后面。这在Chrome上的效果与预期一样，但在Firefox上，它似乎只是溢出。在这种情况下，是否需要应用额外的CSS样式，或者这是Firefox中已损坏/未实现的样式？

不幸的是，这是一个报告。Firefox和Opera的行为符合预期

让Webkit正确渲染的唯一方法是将图像的最大高度设置为容器的高度：

#container > img {
    max-height: 300px;
}

演示

我想这不是预期的答案，但可能仍然有帮助

#container {
    border: 1px solid #000;
    width: 1200px;
    height: 300px;
    -moz-column-width: 300px;
    -webkit-column-width: 300px;
}

#container > img {
    max-height: 300px;
}