twitter-bootstrap - Bootstrap 4行列不中断行(Bootstrap 4 row columns not breaking row)

Question

I'm trying to create a bootstrap grid where every row has to columns, bootstrap has a class that does this, row-cols-*, but when I place the example on bootstrap website in a jsfiddle it doesn't break row like it is supposed to do.

(我正在尝试创建一个引导网格，其中每一行都必须包含列，引导具有一个执行此操作的类row-cols- *，但是当我将示例放在jsfiddle中的引导网站上时 ，它不会像这样破坏行应该做的。)

What am I doing wrong?

(我究竟做错了什么？)

HTML:

(HTML：)

<div class="container">
  <div class="row row-cols-2 text-white">
    <div class="col border bg-primary">Column</div>
    <div class="col border bg-primary">Column</div>
    <div class="col border bg-primary">Column</div>
    <div class="col border bg-primary">Column</div>
  </div>
</div>

  ask by Hugo Persson translate from so

Answer 1

External resources in JSFiddle (Adding Twitter Bootstrap CDN)

(JSFiddle中的外部资源（添加Twitter Bootstrap CDN）)

The logic is the same as when you set it up in an editor, like Brackets.

(逻辑与在括号等编辑器中进行设置的逻辑相同。)

Try this:

(尝试这个：)

<div class="container">
  <div class="row row-cols-2">
    <div class="col">Column</div>
    <div class="col">Column</div>
  </div>
  <div class="row row-cols-2">
    <div class="col">Column</div>
    <div class="col">Column</div>
  </div>
</div>