如果图像在右侧，我该如何自动换文字？

Question

我试图获取一些文字来包裹放在右边的图像（对于放在左边的图像，它会自动包裹）。关于如何做到这一点的任何想法？这就是我现在所拥有的。

<div class="row clear">
    <div class="col-md-7 text-left">
          <div class="heading">Blash blah blsh</div>
                <div class="feature-txt-body">This is a long piece of text that is so long that it needs to break into multiple lines. I am now writing some jibberish text and I have no idea what I am writing. I need to <b>only</b> focus on what's relevant to you. Now if you look at this line, it is not wrapping around the image.</div>
          </div>
    <div class="col-md-3">
     <div id="image"></div>
     </div>
</div>

Answer 1

你可以使用bootstrap的.pull-right类（基本上只是一个浮点数：右）来实现这一目的而不使用列。

你可以看到它在这个bootply中工作：http://www.bootply.com/sc6dvO9rj3

HTML（整理一下）：

<div class="row">
  <img class="pull-right" width="100" height="100" src="..." />
  <h1>Blah blah blah</h1>
  <p>
      This is a long piece of text that is so long that it needs to break into multiple lines. I am now writing some jibberish text and I have no idea what I am writing. I need to <strong>only</strong> focus on what's relevant to you. Now if you look at this line, it is not wrapping around the image.
  </p>   
</div>

Answer 2

DEMO

<div class="row clear">
    <div class="col-md-7 text-left">
          <div class="heading">Blash blah blsh</div>
                <div class="feature-txt-body"> 
     <div class="col-md-3">
     <div id="image" style="background:#000; width:200px; height:100px; float:right;"></div>
     </div>This is a long piece of text that is so long that it needs to break into multiple lines. I am now writing some jibberish text and I have no idea what I am writing. I need to <b>only</b> focus on what's relevant to you. Now if you look at this line, it is not wrapping around the image.This is a long piece of text that is so long that it needs to break into multiple lines. I am now writing some jibberish text and I have no idea what I am writing. I need to <b>only</b> focus on what's relevant to you. Now if you look at this line, it is not wrapping around the image. This is a long piece of text that is so long that it needs to break into multiple lines. I am now writing some jibberish text and I have no idea what I am writing. I need to <b>only</b> focus on what's relevant to you. Now if you look at this line, it is not wrapping around the image</div>
          </div>

</div>

将图像置于文本div中将使其以环绕方式浮动到文本的右侧

Answer 3

使用普通，无聊的HTML：

<img align="right" src="..." />

http://jsfiddle.net/jpvk2sLt/

我会推荐CSS变种float:right，但