Bootstrap4 .col всегда берет 100% и укладывается вертикально (не работает сетка начальной загрузки)

Question

Я пытаюсь создать простую страницу с помощью Bootstrap 4. Появится левая боковая панель и область содержимого, каждая из которых представляет собой столбец с рядом (для каждой системы сетки начальной загрузки).Однако даже при настройке левого столбца на более мелкие классы («col-3», «col-sm-4» и т. Д.) Столбец занимает 100% ширины строки.Любопытно, что содержимое в первом столбце будет уменьшаться в размере в соответствии с меньшим классом столбца, но независимо от того, какой класс выбран, поле увеличивается до тех пор, пока первый столбец не заполнит всю строку и не переместит второй столбец в новую строку.

<div class="container-fluid">
    <div class="row no-gutters">
        <div class="col-6">
            <button type="button" class="btn btn-light" style="width: 100%;">Client 1</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 2</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 3</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 4</button><br>
        </div>
        <div class="col-6">
            <p> Some test content</p>
        </div>
    </div>
</div>

<div class="container-fluid">
    <div class="row no-gutters">
        <div class="col">
            <button type="button" class="btn btn-light" style="width: 100%;">Client 1</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 2</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 3</button><br>
            <button type="button" class="btn btn-light" style="width: 100%;">Client 4</button><br>
        </div>
        <div class="col">
            <p> Some test content</p>
        </div>
    </div>
</div>

Первый и второй кодовые блоки должны давать одинаковый результат.Рядом столбцы 1/2 ширины контейнера div.Тем не менее, я получаю сложенные столбцы в обоих случаях.Однако есть одно отличие.

В первом блоке кода я получаю первый столбец, который составляет 50% от ширины контейнера, кнопки, заполняющие эту ширину, и поле для остальных 50%.С колонкой 2, расположенной снизу при ширине контейнера 100%.

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

Я в растерянности, любая помощьс благодарностью.

Answer 1

Смущает, но я разобрался с ответом ... Была загружена вторая таблица стилей для форматирования контента другого участника.Эта таблица стилей также содержала класс строк, который заменял класс строк загрузчика и давал неверные результаты.

Спасибо за ваш вклад!