2013-03-18 3 views
3

Я должен отображать все дни недели календаря (равно 7), равномерно распределенные в 12-сегментной строке, используя bootstrap отзывчивый css.Как распределить нечетное число столбцов «равномерно» с помощью бутстрапа?

Я попытался

<div class ="span12"> 
<div class="span2"> Monday </div> 
....... 
...... 
<div class="span2"> Sunday </div> 
</div> 

Это будет продолжаться в течение 12 пролете и оборачивает последний столбец в следующей строке.

Кто-нибудь знает, как правильно это сделать?

Спасибо!

ответ

2

Спасибо! Я просто увеличил процентную ширину слоя .row-fluid span2 и создал его как отдельный класс. Это сработало!

.row-fluid .daySpan { 
    width: 14.192978723404255%; 
    *width: 14.192978723404255%; 
} 
1

Для установки пользовательской ширины вам необходимо использовать свой собственный класс, а не сетку. Я бы, вероятно, объединил его с существующим классом grid bootstrap, чтобы ввести его поля и т. Д.

Не забывайте строку div, которая обеспечивает отрицательные поля слева и справа.

http://jsfiddle.net/2n8Cx/1 (работает только на одной ширину диапазона с Отзывчивым включен в этой демонстрации.)

.span1.spanDays {width: 86px;} 

<div class="span12"> 
    <div class="row"> 
    <div class="span1 spanDays"> Monday </div> 
    ....... 
    ...... 
    <div class="span1 spanDays"> Sunday </div> 
    </div> 
</div> 

http://twitter.github.com/bootstrap/scaffolding.html#gridSystem

+0

Спасибо! Я просто увеличил процентную ширину слоя .row-fluid span2 и создал его как отдельный класс. Это сработало! – digToGetWater

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