Блог

Главная - Вопросы по программированию - bootstrap 2.3.2 строки не встроенные

bootstrap 2.3.2 строки не встроенные

#css #twitter-bootstrap #twitter-bootstrap-2

#css #twitter-bootstrap #twitter-bootstrap-2

Вопрос:

Я не понимаю, почему это не встроено:

http://jsfiddle.net/dugfresh/dUkz4/

 <div class="btn-group" data-toggle="buttons-checkbox">
    <div class="row">
        <div class="span7"><button type="button" class="btn btn-primary">Sun</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Mon</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Tue</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Wed</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Thu</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Fri</button></div>
        <div class="span7"><button type="button" class="btn btn-primary">Sat</button></div>
    </div>
</div>

Комментарии:

1. Вы неправильно понимаете, как работает сетка начальной загрузки. span7 не для 7 элементов в строке, а для столбца шириной 7 столбцов из 12. Итак, как вы это написали, в каждой строке будет помещаться только одна кнопка. Это также будет сложно для вас, поскольку сетка из 12 столбцов начальной загрузки неравномерно делится на 7. Я не думаю, что вы сможете делать то, что хотите, в системе grid, я бы использовал подход TheLittlePig.

Ответ №1:

Это то, что вы ищете??

скрипка: http://jsfiddle.net/dUkz4/3 /

HTML :

 <div class="btn-group" data-toggle="buttons-checkbox">
    <button type="button" class="btn btn-primary">Sun</button>
    <button type="button" class="btn btn-primary">Mon</button>
    <button type="button" class="btn btn-primary">Tue</button>
    <button type="button" class="btn btn-primary">Wed</button>
    <button type="button" class="btn btn-primary">Thu</button>
    <button type="button" class="btn btn-primary">Fri</button>
    <button type="button" class="btn btn-primary">Sat</button>
</div>

документ: http://getbootstrap.com/2.3.2/components.html#buttonGroups

ОБНОВЛЕНИЕ после комментария:

Вы можете настроить css для пространства :

 .btn-group .btn{
    margin-right:5px;
}

И сделайте что-то вроде

 <div class="btn-group row-fluid" data-toggle="buttons-checkbox">
        <button type="button" class="btn btn-primary span1">Sun</button>
        <button type="button" class="btn btn-primary span1">Mon</button>
        <button type="button" class="btn btn-primary span1">Tue</button>
        <button type="button" class="btn btn-primary span1">Wed</button>
        <button type="button" class="btn btn-primary span1">Thu</button>
        <button type="button" class="btn btn-primary span1">Fri</button>
        <button type="button" class="btn btn-primary span1">Sat</button>
    </div>

Вот результат (отзывчивый): http://jsfiddle.net/dUkz4/4 /

Комментарии:

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