Twitter引导程序没有得到我想要的页面布局

Question

我正在使用twitter bootstrap进行布局，目前这就是我的页面：

我想移动'健身是我们的目标'文字冲洗大图 - 但由于我的布局处理方式不会发生。

目前我有以下布局：

div class="col-md-12">
<h3>
  class name here
</h3>
</div>

<div class="col-md-8">
big picture here
  </div>
  <div class="col-md-4”>

all details on right hand column here - ending with address
 </div>

<div class="col-md-8”>
Fitness is our goal text - it is this div I want moved up flush underneath the image
</div>

我想要的结果是：

请帮忙！

Answer 1

它是否会破坏您的布局以将文本移动到图像的列中，如下所示：

<div class="col-md-12">
<h3>
  class name here
</h3>
</div>

<div class="col-md-8">
big picture here

Fitness is our goal text - it is this div I want moved up flush underneath the image
  </div>
  <div class="col-md-4”>

all details on right hand column here - ending with address
 </div>

如果不是那么你可能还想确保你没有围绕该图像的包装器强制一定的大小比例，在它和下一列之间增加空间。

Answer 2

当您选择将图片和文字放在同一列中时，您不必说两次。将它们放在同一列中，在单独的行中。

试试这个......

...
<div class="col-md-8">
    <div class="row">
        big picture here
    </div>
    <div class="row">
        Fitness is our goal text - it is this div I want moved up flush underneath the image
    </div>
</div>
<div class="col-md-4”>
    all details on right hand column here - ending with address
</div>
...