浮动IMG调整大小百分比

Question

我正在尝试与容器成比例地调整img的大小。IMG向左浮动，周围有一段文字。

HTML:

<div>
<img src="picture.png">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vestibulum venenatis      libero, eu egestas elit laoreet nec. Donec in nunc dictum nunc luctus eleifend sagittis id augue.</p>
</div>​

CSS：

div {
width: 80%;
}
img {
max-width: 100%;
float: left;
margin: 0 10px 10px 0;
}

​只有当左div边框碰到图像并且段落完全位于img下方时，图像才会调整大小。我想在div调整大小后立即调整img的大小。我知道我可以把img放在包装器div中，并给它一个百分比宽度，但如果可能的话，我想要一个更干净的解决方案。

JSFiddle：http://jsfiddle.net/989uX/

Answer 1

'max-wid'CSS属性设置IMG元素的最大内容宽度。换句话说，即使设置了更大的宽度，该元素也不会更宽。如果要重新调整元素的大小，则应使用"width"属性，而不是"max width"。此属性也接受百分比值(如上面提到的Passerby)。请注意，元素的百分比值是指包含块的宽度。