如何防止空img元素收缩？

Question

• 我有一个<img>元件（上载图像预览帧），其scr将由Javascript，设置，

• 所以当最初被加载它，它有在它没有图像，我已经设置其width和由css在性能上保持其大小和位置（事实上，它是暗示用户知道什么是适当的长宽比为所需的图像）。

• 此代码在IE和Chrome中运行良好，但问题在于Firefox不保留帧的初始大小（当为空）并缩小到零大小。

我怎样才能解决这个问题？

代码：

<img width="90" height="120" class="uploadPreview" id="Preview_pic" > 

CSS：

img.uploadPreview { 
    width:90px; 
    height:120px; 
    border-style:groove; 
} 

非常感谢你！

Answer 1

您可以防止收缩通过使<img>display:block;或display: inline-block;

演示：http://jsfiddle.net/sp8n67u1/1/

img.uploadPreview { 
    width:90px; 
    height:120px; 
    border-style:groove; 
    display: block; 
}