Question

我正在试图弄清楚如何使用bootstrap进行以下网格搜索。

我有4个“col-md-3”div但是在最后一个“col-md-3”div下面我希望在它下面有2个cols，每个占据'col-md-3'宽度的一半。

我希望最后一个col下面的两个堆叠在一起。

我本来可以使用像这里的五个宽度＆gt;＆gt; https://stackoverflow.com/a/22799354/8011344但最后一个col div下的内容只需要一个小的宽度，如12.5％

任何想法

A picture of what Im trying to do

https://i.stack.imgur.com/gv3a7.png

Answer 1

首先添加四个col-sm-3，在最后一个col中添加两个带col-xs-6的col，其值为50％

＆＃13;

[class*='col-']{
  background:#f0f0f0;
  margin-bottom:5px;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="row">
  <div class="col-xs-3">col-xs-3</div>
  <div class="col-xs-3">col-xs-3</div>
  <div class="col-xs-3">col-xs-3</div>
  <div class="col-xs-3">
    <div class="row">
      <div class="col-xs-6">col-xs-6</div>
      <div class="col-xs-6">col-xs-6</div>
    </div>
  </div>
</div>

＆＃13;

Bootstrap col-md-3，下面有2个子列

1 个答案: