Html 引导，无法将图像和文本并排放置在3组中

我很难把我的图像直接放在每套文本的左边，文本一直显示在图像下面。我用的是col-md-4，所以我有3套文字和图像

.container{
浮动：左；
显示：块；
}

多才多艺的太空之旅——雷姆·伊普苏姆·多洛·希特·阿梅特，一位杰出的宇航员

中心位置
Lorem ipsum dolor sit amet，是一位杰出的领导者

迎合口味
Lorem ipsum dolor sit amet，是一位杰出的领导者

由于您使用的是引导，您可以在图像上添加类

左拉

，或者将HTML更改为类似这样的内容

<img src="images/pointericon.png">
<h3>Central Location</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>

---

将图像向左浮动：

.demo content img{Float:left；}

我尝试了这个示例，但仍然以堆叠的形式显示，而不是并排显示，有没有办法在引导中使它们更紧密地结合在一起，以便它们都能正确地匹配？我只是尝试了向左拉动，并将它们并排放置在一起，现在我该如何在图像和文本之间留出空间？@Leeish这很好，现在我需要在并排的图像和文本之间留出一些空间，我该如何做到这一点？一种方法是在包装文本的

col-xs-8

上添加左边的填充。您可以更改列的大小并添加一个分隔符。所以用4-1-7代替4-8。您可以包装文本并在包装中添加填充。它的CSS有很多种方式。你原来的问题得到了回答。如果你还有其他问题，请提出另一个问题。

<div class="col-xs-4"><img src="images/pointericon.png"></div>
<div class="col-xs-8">
<h3>Central Location</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p></div>

<div class="container">
  <!--Row with three equal columns-->
  <div class="row">
    <div class="col-md-4">
      <div class="demo-content row">
        <div class="col-xs-4">
          <img src="//placehold.it/120">
        </div>
        <div class="col-xs-8">
          <h3>Versatile Spaces</h3>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
        </div>
      </div>
    </div>
    <div class="col-md-4 row">
      <div class="demo-content bg-alt">
        <div class="col-xs-4">
          <img src="//placehold.it/120">
        </div>
        <div class="col-xs-8">
          <h3>Versatile Spaces</h3>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
        </div>
      </div>
    </div>
    <div class="col-md-4">
      <div class="demo-content row">
        <div class="col-xs-4">
          <img src="//placehold.it/120">
        </div>
        <div class="col-xs-8">
          <h3>Versatile Spaces</h3>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
        </div>
      </div>
    </div>
  </div>
</div>