图像不会留在div边界内

Question

网站: isfnpub.com

现在我正在使用额外的填充来使图像适合,但正如你所见,div的东西完全忽略了图像.

我在Wordpress内部工作.

使用的代码:

<div style="border: 5px solid #FFC85D; padding: 10px; margin:30px;">

<p><strong>UPCOMING RELEASE: ISFN ANTHOLOGY #1</strong></p>

<p>[caption id="attachment_801" align="alignright" 
width="189" 
caption="Click image for full cover spread."]
<a href="http://ISFNpub.com/wp-content/uploads/2010/07/cover-small-full.jpg" 
target="_blank">
<img src="http://ISFNpub.com/wp-content/uploads/2010/07/cover-small-189x300.jpg" 
alt="" 
title="Anthology 1 front" 
width="189" height="300" 
class="size-medium wp-image-801" /></a>
[/caption]
<strong>Authors: </strong> blah blah blah.</p>

<p><strong>Cover Art By:</strong> Xenia Latii</p>

<p>blah blah blah</p>

</div>

我希望div边框自然地包裹所有内容,包括图像.没有额外的填充,图像与边框重叠,一切看起来都是丑陋的.

谢谢.

编辑:我用过<div style="overflow:auto; ...">它似乎工作.这是一个合适的解决方案,还是以后会遇到麻烦？

Answer 1

如果我理解正确,那么我认为这就是你所需要的.尝试使用overflow:hidden那应该是解决你的问题.