html - 将图像与 div 中文本的右侧对齐

Question

我确定这是一个简单的问题，但我想不出来。 我基本上有这段代码

<div>
<img />
<p></p>
</div>
<div>
<img />
<p></p>
</div>

我希望图像在 div 中与文本的右侧对齐。到目前为止，我尝试过的所有操作都将图像从正常页面流中取出，使 div 不尊重图像的高度。我不能只明确说明 div 的高度，因为里面的图像是动态的并且只有设置的宽度。

页面如下所示。

如何将图像对齐到 div 的右侧，同时让 div 保持图像的高度。

Answer 1

基本上你的 div 必须有 overflow:hidden ，看例子:

<div style="overflow:hidden">
    <img style="float:right; width:100px; height:100px"/>
    <div>text text text text text text text text</div>
</div>
<div style="overflow:hidden">
    <img style="float:right; width:100px; height:100px"/>
    <div>text text text text text text text text</div>
</div>

或者你可以输入 <div style="clear:both"></div>在每个 div 之后