空时调整引导网格列的大小

Question

我正在使用最新的引导程序。我有三个引导col-sm网格列。在每一列中都有引导卡。当我删除某一列中的所有卡片时，我想将其宽度调整为20px。我尝试使用CSS，但是该列未调整大小。有解决办法吗？

还有一件事-调整列的大小时，其他列会相应地调整大小以填充空白吗？

@import "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css";

<div class="container">
  <div class="row">
    <div class="col-sm">
      <div class="card">
        <div class="card-body">
          This is some text within a card body.
        </div>
      </div>
      <div class="card">
        <div class="card-body">
          This is some text within a card body.
        </div>
      </div>
    </div>
    <div class="col-sm">
      <div class="card">
        <div class="card-body">
          This is some text within a card body.
        </div>
      </div>
      <div class="card">
        <div class="card-body">
          This is some text within a card body.
        </div>
      </div>
    </div>
    <div class="col-sm">
      This column should resize when it's empty.
    </div>
  </div>
</div>