Оправданная.btn-группа с Bootstrap v4-alpha-5

Заданный здесь вопрос касается обоснованной группы кнопок в <альфа-3. Он не работает в альфа-5 (и я думаю, в альфа-4 также).

Из того, что я собрал из списка проблем, он был удален и не вернется.

Я использую SCSS и, возможно, flexbox, если это обеспечивает лучшее решение.

Я хотел бы использовать переключатели состояния переключения

<div class="btn-group" data-toggle="buttons">
    <label class="btn btn-primary active">
        <input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1 (preselected)
    </label>
    <label class="btn btn-primary">
        <input type="radio" name="options" id="option2" autocomplete="off"> Radio 2
    </label>
    <label class="btn btn-primary">
        <input type="radio" name="options" id="option3" autocomplete="off"> Radio 3
    </label>
</div>

Кто-нибудь может предложить решение?

2 ответа

Решение
<div class="btn-group d-flex" role="group">
   <a href="" class="btn btn-secondary w-100">Previous</a>
   <a href="" class="btn btn-secondary w-100">Next</a>
</div>

Прочитайте https://getbootstrap.com/docs/4.0/migration/.

Вы всегда можете добавить пользовательский CSS в свой код, если он отсутствует

.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
}
.btn-group-justified .btn,
.btn-group-justified .btn-group {
    float: none;
    display: table-cell;
    width: 1%;
}
.btn-group-justified .btn .btn,
.btn-group-justified .btn-group .btn {
    width: 100%;
}
.btn-group-justified .btn .dropdown-menu,
.btn-group-justified .btn-group .dropdown-menu {
    left: auto;
}
Другие вопросы по тегам