2016-11-12 2 views
0

Я использую Bootstrap в течение последних нескольких недель, и мне нравится сетка и интересное использование атрибутов данных HTML5, но одна вещь, которую я не могу представить, ,Размешение содержимого в Bootstrap

Я могу создать row один за другим или даже просто контейнеры, а также их очевидные желоба между каждым столбцом (col-md-*), нет ничего вертикально в пространстве вашего контента.

В моем последнем проекте я создал несколько разделительных классов, чтобы добавить некоторые вертикальные поля между некоторыми из моих контейнеров - но это кажется излишним.

Как вы должны правильно размещать свой контент?

+0

Hard css - единственный способ ... Наверное? –

ответ

0

Кажется, в Bootstrap нет специальных классов. Но я думаю, это навсегда.

Bootstrap не всегда может «знать», сколько места вам понадобится. Вы должны создать его самостоятельно. Вот почему вы разработчик :)

Посмотрите на эти решения: Add vertical blank space using twitter bootstrap:

1) использовать загрузочный встроенный в классе form-group

<div class="form-group"> 
    &nbsp; 
</div> 

2) или добавить дополнительный блок после каждой строки вам нужно :

<div class="col-xs-12" style="height:50px;"></div> 

3) или создать новый класс и добавить дополнительный блок после каждого row вам нужно:

CSS:

.spacer { margin:0; padding:0; height:50px; } 

HTML:

<div class="spacer"></div> 

4) Или, если вам действительно нужно пространство после каждый строки элемента, добавить дополнительный стиль для row класса:

.row { padding-bottom: 50px } 

Пример: https://jsfiddle.net/3a36p06h/

Смежные вопросы