Bootstrap 4 .card-deck 弄乱了列宽答案

【问题标题】：Bootstrap 4 .card-deck messes up column widthBootstrap 4 .card-deck 弄乱了列宽
【发布时间】：2016-03-27 06:30:47
【问题描述】：

注意上面两张牌的宽度没有下面一张那么宽

View source

源代码：

<div class="col-md-12">
  <div class="card-deck m-b-1">

    <div class="card">
      <div class="card-block">
        <img alt="Card image cap" class="card-img-top" src=
        "http://lorempixel.com/318/180/sports/5">
        <h4 class="card-title">Card title</h4>
        <p class="card-text">This is a longer card with supporting text below
        as a natural lead-in to additional content. This content is a little
        bit longer.</p><a class="card-link" href="#">Läs mer</a>
      </div>
    </div>

    <div class="card">
      <div class="card-block">
        <img alt="Card image cap" class="card-img-top" src=
        "http://lorempixel.com/318/180/sports/7">
        <h4 class="card-title">Card title</h4>
        <p class="card-text">This card has supporting text below as a natural
        lead-in to additional content.</p><a class="card-link" href="#">Läs
        mer</a>
      </div>
    </div>

  </div>
</div>

我尝试过更改行和列结构，根本不使用列，但没有成功！

【问题讨论】：

标签： html css twitter-bootstrap alignment width

【解决方案1】：

实际上，这并没有搞砸，这是预期的视图。卡片组中有 2 张卡片，所以有 2 列。要使上面的 2 张卡片与下面的卡片宽度相同，请将它们从卡片组 div 中取出。

【讨论】：