css - 文字重叠图片

Question

所以我有一个简单的生物类型页面，左边是一系列图像，右边是关于这个人的简短段落。它们都是中央栏的一部分，因此在两者(图像和书面简介)的左侧都有一个导航栏，在右侧有一些装饰物。该页面在 Firefox 3.5.2 和 IE 8 (8.0.6001.18813) 中没有问题，但在 Safari 4.0.3 和 Chrome 2.0 中都出现了问题。问题在于，对于某些简介，简介的文本与图像重叠，就好像那里没有图像一样。此外，当重新加载页面时，文本重叠的 bios 有时会发生变化。似乎有一组可以证明这个问题，因为其中一些从来没有。它们在周围标签方面的布局完全相同。

我的第一个想法是这里存在高度问题，一些 googleing 似乎支持这一点，但经过一些测试后我不确定。我用一个新的 div 包围了 bios 部分，并将其高度设置为较高的值，该页面出现了同样的问题，只是它现在在 bios 下方有大量新的空白区域。图像也设置为 align=left。我应该寻找什么想法？

Answer 1

您是否将图像设置为 display: block或者将它们包含在 <p> 中？

将图像放在段落之外。

改变这个

<p>text text 
<img />
text text</p>

到

<p>text text</p>
<p><img /></p>
<p>text text</p>