图片不会留在 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 边框自然环绕所有内容，包括图像。如果没有额外的填充，图像会与边界重叠，并且一切看起来都是 uglo。

谢谢。

编辑： 我使用了 <div style="overflow:auto; ..."> 它似乎有效。这是一个合适的解决方案，还是我以后会遇到麻烦？

原文由 iDontKnowBetter 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果我理解正确，那么我认为这就是您所需要的。尝试使用 overflow:hidden 应该可以解决您的问题。

原文由 Elias Rodrigues 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

尝试 overflow: hidden 并将 div 的宽度设置为 300px，然后将图片宽度设置为 100%。

原文由 Valery 发布，翻译遵循 CC BY-SA 4.0 许可协议