Question

我的问题是card-deck的属性（.card-deck类创建了一个高度和宽度相等的卡网格。当您插入更多卡时布局会自动调整。）似乎不是申请。

这是代码：

<div class="container-fluid"> 
<div class="card-group">
    <div class="card" id="col1m">
        <div class="card-header text-center" style="color: #888" id="display1_title">CAUDAL abcdefghi (BPM)</div>
        <div class="card-body text-center" id="col1">
            <p class="card-text" style="font-family:roboto; font-weight: bold; color:#888" id="display1_value">0</p>
        </div>
    </div>

    <div class="card" id="col2m">
        <div class="card-header text-center" style="color: #888;" id="display2_title">VOL. TOTAL (BBL)</div>
        <div class="card-body text-center" id="col2">
            <p class="card-text" style=" font-family:roboto; font-weight: bold;   color: #888" id="display2_value"> 0 </p>
        </div>
    </div>
</div>
</div>

Answer 1

您的代码末尾有一个封闭的div，其中有一个开放的div 这是您的代码，工作正常

https://codepen.io/growload/pen/QWwMybX?editors=1000

<div class="card-group">

  <div class="card" id="col1m"   >
      <div class="card-header text-center"  style=" color: #888" id="display1_title">CAUDAL (BPM)</div>
      <div class="card-body text-center"   id="col1" >    
      <p class="card-text" style=" font-family:roboto; font-weight: bold;  color: #888"   id="display1_value"> 0  </p>
      </div>
  </div>

<div class="card" id="col2m"  >
      <div class="card-header text-center"  style=" color: #888 ; " id="display2_title"  >VOL. TOTAL (BBL)</div>
      <div class="card-body text-center"   id="col2"   >    
      <p class="card-text" style=" font-family:roboto;    font-weight: bold;   color: #888"   id="display2_value"> 0  </p>
      </div>
  </div>
</div>

没有应用等高的Bootstrap 4卡座

1 个答案: