CSS + webkit 使用 % 实现

Question

在 webkit 中与 ie/ff/opera 相比似乎有很大不同。

要复制 - 拍摄一张图片，例如，w: 200px h: 400px。

像这样放入 html。

<div id="container">
    <img id="whattheeff" src="/image.jpg" height="200" width="200" alt="render bug" />
</div>

并添加css

<style>
div#container{height:1000px;background:#fff;border:1px dashed #000;}
img#whattheeff{width:200px; height:100%;}
</style>

结果是大多数浏览器以其原始高度 400px 显示图像，而 webkit 以其父级的高度显示图像。 1000 像素。

有人见过这个吗？任何人都建议让 webkit 发挥同样的作用。

Answer 1

我解决了这个问题:

我设置了 height:auto; 而不是 100%。

原来 auto 会忽略图像标签中的声明并查看图像的 auto 高度...与 100% 在大多数浏览器中一样，除了 webkit .

吸取教训。感谢 Cork 在 freenode 上的#jquery。