2013-08-11 1 views
7

Я считаю, что для обеспечения стандартного поля мы можем использовать класс «Смещение» в бутстрапе. В то же время, что такое класс, который может использоваться для обеспечения стандартного поля? пример:Bootstrap: класс для margin-right?

<div class="row-fluid"> 
    <div class="offset2 span8"></div> 
</div> 

по какой-то причине мне нужно дать маржу правый эквивалент смещение2. Некоторое решение будет очень полезно. Спасибо.

+0

Я подозреваю, что это совершенно излишним. Ваш пример показывает, почему. –

+2

На боковой ноте вы должны использовать класс span-x, а затем ваше смещение (т. Е. Class = "span8 offset2"). –

ответ

10

Нет эквивалентного класса для offset-x для margin-right и по уважительной причине, он не нужен. Подумайте об этом так, если вам нужен 6 столбец DIV, который смещен вправо и влево 3 колонки, вы должны использовать:

<div class="row"> 
    <div class="span6 offset3">Your content...</div> 
</div> 

Кроме того, если у вас есть 6 столбец DIV, который должен быть компенсировано только 2 колонны НО, смещение должно быть 2 колонки на правой, то код будет:

<div class="row"> 
    <div class="span6 offset4">Your content...</div> 
</div> 

Имейте в виду, что вы всегда работает в 12 столбцов (если изменения в variables.less), так что вы не можете использовать поверочного-х И offset-x для достижения желаемой позиции. Если вы хотите настроить дополнительные пиксели, добавьте дополнительный класс (или ID) в контейнер содержимого внутри вашего диапазона. Например:

<div class="row"> 
    <div class="span6 offset4"> 
     <div class="tweaked-margin">Your content...</div> 
    </div> 
</div> 

CSS:

.tweaked-margin { 
    margin-right: 4px; // or whatever you need 
} 
+0

Читая это, я задаю другой вопрос. Я использую для написания {width: 960px; \t margin: 0 auto;} чтобы содержимое всегда располагалось в центре. Если я напишу что-то вроде

My entire content
, будет ли это эквивалентным кодом, чтобы мой контент всегда находился в центре на страницах с гибкой жидкостью, оставляя равное пространство как в левой, так и в правой части содержимого? Спасибо за ваше время, потраченное на это. Это очень помогает. –

+1

Да, это точно. Кроме того, отсутствие ширины установки в px в процентах. Если вам нужно немного больше контроля, используйте max/min-width (или высоты, если на то пошло). Это приемлемо, поскольку поддержка браузера восходит к IE8. Кроме того, если я хочу центрировать элементы, скажем, кнопку, а не добавлять margin: 0 auto к самому элементу, я обычно просто переношу его в контейнер уровня блока и применяю text-align: center; к нему. Подумайте так; всегда сначала устанавливайте свое позиционирование с помощью сетки, используя диапазоны-x и смещения по мере необходимости для всего первичного позиционирования, а затем откорректируйте оттуда. –

+2

Это не будет работать на мобильном дисплее, так как после определенной ширины устройства каждый диапазон преобразуется в span12. –

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