Как иметь пустой col-md- * в бутстрапе

Я пытаюсь иметь два неравных столбца в бутстрапе. Я хочу иметь один столбец с каждой стороны (поэтому, если есть столбцы от 1 до 12, 1 и 12 будут пустыми), а col-md-2 ~ 5 - один столбец, а 6 ~ 11 - другой столбец.

Я не могу найти пример для этого (кроме смещения) - может ли кто-нибудь мне помочь?

Ответ 1

Если вы не хотите использовать смещение согласно вашему требованию, используйте

<div class="container">
  <div class="row" style="background:red">
     <div class="col-md-1" style="background:yellow">&nbsp;</div>
     <div class="col-md-4" style="background:green">B</div>
     <div class="col-md-6" style="background:red">C</div>
     <div class="col-md-1" style="background:yellow">&nbsp;</div>
  </div>
</div>

Но, я думаю, вы должны использовать смещения

Ответ 2

Используйте смещения. Вам нужно только определить первое смещение, так как второй столбец будет плавать рядом с первым.

<link href="#" onclick="location.href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css'; return false;" rel="stylesheet"/>

<div class="container">
  <div class="row">
    <div style="background:#f99" class="col-xs-4 col-xs-offset-1">Cols 2-5</div>
    <div style="background:#9f9" class="col-xs-6">Cols 6-11</div>
  </div>
</div>