Подтвердить что ты не робот

Строка бутстрапа Twitter с обертками прокрутки

Используя twitter bootstrap, я пытаюсь понять, почему последний столбец обертывается.

<div class="row span4 solidBottom">
        <div class="span1">
            <label>A</label>
        </div>
        <div class="span1">
            <label>B</label>
        </div>
        <div class="span1">
            <label>C</label>
        </div>
        <div class="span1">
            <label>D</label>
        </div>
</div>

Это приводит к:

 A   B   C 
 D
___________

SPAN 4 = 300px
Four Span1s = 240
3 Paddings = 60
240 + 60 = 300

Итак, какая-нибудь подсказка о том, почему она обертывается?

Я пытаюсь сделать несколько форм столбцов и хотел бы сохранить упорядоченные столбцы и строки.

Спасибо.

EDIT: добавление style="width:auto" в строку решает проблему, но почему размер ширины по умолчанию по умолчанию 300px?

4b9b3361

Ответ 1

Вы правы, что span4 составляет 300 пикселей, но я считаю, что в вашем HTML есть ошибка.

Вам нужно обернуть ваши вложенные столбцы в новый класс .row. Когда вы это сделаете, завершение завершается. См. http://jsfiddle.net/panchroma/UBTv4/ и пример с использованием сетки Bootstrap по умолчанию (нежидкость).

Это HTML, который я использовал:

<div class="container">

<div class="row">
    <div class="span4 solidBottom">

        <div class="row">
            <div class="span1">
                <label>A</label>
            </div>

            <div class="span1">
                <label>B</label>
            </div>

            <div class="span1">
                <label>C</label>
            </div>

            <div class="span1">
                <label>D</label>
            </div>

        </div> <!-- end nested row -->

        <div class="span8"> </div>

  </div> <!-- end parent row -->
</div> <!-- end container -->  

Для фиксированных сеток число столбцов во вложенной строке должно складываться до количества столбцов в родительском столбце (т.е. четыре в этом случае)

Если вы используете жидкостные решетки (например, строка-жидкость), количество столбцов во вложенной строке должно составлять до 12.