Bootstrap 4 отзывчивый интервал не работает

Я использую классы как определено

применяется маржа элемент адаптивного останова {свойство}{борта}-{останова}-{размер} m (t, b, r,l,x, y) - (sm, md, lg, xl)-(0, 1, 2, 3, 4, 5)

означает, что

<div class="col-12 mb-sm-3"></div>

должен производить div с нижним краем на небольших устройствах, но это не так.

2 ответов


Я понял, что происходит. Mb-sm-3 влияет только на минимальную ширину 576px, поэтому в мобильном телефоне, например, iphone 6, минимальная ширина меньше 576, поэтому мне нужно было:

<div class="col-12 mb-3 mb-sm-0"></div>

это создает дно поля 3 Для ниже sm (xs в случае), а затем sm и выше получают ноль.

Спасибо за помощь.


margin-bottom: 1rem!important; добавляет к .mb-sm-3

проверить это

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet"/>
<div class="col-12 mb-sm-3" style="background:blue;height:20px;"></div>
<div>Space above is the margin of the `mb-sm-3`</div>