响应式间距即 mb-lg-2 mb-sm-3 等在 Bootstrap 5 中不起作用

如何解决响应式间距即 mb-lg-2 mb-sm-3 等在 Bootstrap 5 中不起作用

在引导程序 4 中，这些类工作正常。但是它们在 Bootstrap 5 中不起作用。知道为什么吗？

注意：d-block d-lg-flex、text-center text-lg-start text-md-end 这些都工作正常。看起来只有边距和填充相关的类不起作用。

示例代码：

 <div class="d-block d-lg-flex justify-content-center flex-row bd-highlight ">
    <div class="mb-0 mb-md-3 mb-lg-0">
        <div class="dropdown text-center cairo ">
            <select x-model="selectedUnits" class="form-select feature_text" aria-label="Default select example">
                <option selected="" disabled="">Select unit amount</option>
                <option value="myval">1 unit</option>
                <option value="myval">1 unit</option>
                <option value="myval">1 unit</option>
            </select>
        </div>
    </div>
</div>

解决方法

边距类 mb-0 mb-md-3 mb-lg-0 应在 Bootstrap 4 和 Bootstrap 5 中按预期工作。

Responsive margin bottom working in Bootstrap 5

但是 text-lg-left text-md-right 在 Bootstrap 5 中已更改为 text-lg-start text-md-end