html - 在 Bootstrap 的两列之间留下一个空的 col-md-1 以留出间距？

Question

  <div class="row justify-content-center">
    <div class="col-md-4">
        Column width of md-4
    </div>

    <div class="col-md-1 .d-sm-none">
        <!-- Gap between columns -->
    </div>

    <div class="col-md-4">
        Column width of md-4
    </div>
</div>

这是在这两列之间留空 col-md-1 的正确方法吗？并使用 .d-sm-none 将其隐藏在移动设备上。还是有更好/更清洁的方法来做到这一点？

标签： htmlcssbootstrap-4spacing

Answer 1

是的，您可以尝试这种方式

<div class="row justify-content-center">
    <div class="col-md-4">
        Column width of md-4
    </div>
    <div class="offset-md-1 col-md-4">
        Column width of md-4
    </div>
</div>

https://jsfiddle.net/lalji1051/hyp84gLu/2/