首页 > 解决方案 > Bootstrap 4 网格 - 3 列 - 5.5 - 1 - 5.5

问题描述

看起来半列大小在 Boostrap 4 中是可行的。

我正在尝试做一个基本的响应式布局,如下所示。我意识到他们必须添加到 12。

第 1 栏 (5.5) - 第 2 栏 (1) - 第 3 栏 (5.5)

这篇文章似乎暗示这是可能的?我想确保它保持基本的排水沟和间距。

https://medium.com/wdstack/the-bootstrap-4-is-getting-odd-e9400b121719

实现这一目标的最简单方法是什么?就像是:

<div class="row">
    <div class="col-55">
        Col 1 - 55%
    </div>
    <div class="col-05"> 
       Col 2 - 5%
    </div>
    <div class="col-55"> 
      Col 3 - 55%
    </div>
</div>

标签: twitter-bootstrapbootstrap-4

解决方案


如文章中所述,使用auto-layout与网格列组合的列...

<div class="row">
    <div class="col">
        5.5
    </div>
    <div class="col-1">
        1
    </div>
    <div class="col">
        5.5
    </div>
</div>

https://www.codeply.com/go/Io0HKVWjmD


推荐阅读