Question

我试图将文字包裹在图像周围，但出于某种原因，它不是。

Image showing what it looks like http://tivohd582.photobucket.com/albums/ss264/anthonycortese9/ScreenShot2013-02-03at10446PM_zps68f76d84.png?t=1359915134

CSS：

.historyimage {
   float: right;
   margin-top: 260px;
   padding: 10px;
}

非常感谢！

Answer 1

如果您正在讨论历史块的第一段，则该空间由您图片的margin-top拍摄。所以第一段不能使用那个空间。

如果您只想 第二个段落环绕图片，请在HTML代码中填写：

你的第一段

你的形象

你的第二段

然后删除margin-top。

Answer 2

尝试this ...也许你需要......

<强>更新

试试这个......

.historyimage {
    float: right;
    top: 260px;
    padding: 10px;
}

Answer 3

<div id="container" style="width: 200px;">
    <div id="paragraph1">paragraph 1 text</div>
    <div id="image" style="float: right; width: 50px;">testing testing testing</div> <!-- you would put your image here. float this to the right, no margin -->
    <div id="paragraph2">paragraph 2 text paragraph 2 text paragraph 2 text paragraph 2 text paragraph 2 text paragraph 2 text </div>
</div>

Answer 4

如果您想将图片放在文本的底部，最简单的方法是将img代码插入到您希望显示图像的位置。

您可以查看http://jsfiddle.net/qh4br/1/以获取有关图像位置的更多信息。

很抱歉stakoverflow使用不当，这是我的第一个条目......代码的好版本在jsfidle页面中...

<div class="right-side">
 Nullam consectetur, elit sit amet interdum lobortis, urna sapien eleifend arcu, at imperdiet est lacus a neque.
 <img src="http://image1.masterfile.com/em_w/00/60/67/700-00606730w.jpg" width="50" />
Nam blandit mi tortor. Nullam pellentesque facilisis leo in aliquet. Nullam consectetur orci eu ligula laoreet molestie. Nam quis augue enim, ut euismod enim. Integer sit amet consectetur felis. Nam turpis lorem, dictum vel semper ac, rhoncus in metus. 
</div>

文字不会环绕图像

4 个答案: