我在 Bootstrap-4 中有兩個并排的卡片盒，其中包含文本和一些其他元素：<div class="container-fluid">  <div class="card-deck">    <!-- Box 1 (left) -->    <div class="card">      <div class="card-body">                 Box 1          </div>    </div>        <!-- Box 2 (right) -->    <div class="card" >      <div class="card-body">                 <div class="col">            <h4 class="mb-2">              Box 2 Title            </h4>            <p class="small text-muted mb-0">              Box 2 Subtitle            </p>          </div>                <div class="row no-gutters">          <div class="col">col2</div>          <div class="col">col2</div>          <div class="col">col2</div>          <div class="col">col2</div>        </div>                <div class="row no-gutters">          <div class="col">col2</div>          <div class="col">col2</div>          <div class="col">col2</div>          <div class="col">col2</div>        </div>              </div>        </div>  </div></div>現(xiàn)在這兩個盒子的響應(yīng)能力是完美的；如果我將瀏覽器的大小調(diào)整為超??；文字永遠不會離開盒子（很好?。┪蚁Ｍ?Box 2（右側(cè)）比 Box 1（左側(cè)）更寬，我可以通過更改來直觀地實現(xiàn)此目的<!-- Box 1 (left) --> <div class="card">到<!-- Box 1 (left) --> <div class="card col-4">通過添加col-4。這實現(xiàn)了我想要的視覺變化：但現(xiàn)在，當(dāng)我調(diào)整瀏覽器大小時，框 1 的文本會剪輯到框外（糟糕！不想要，我想要）Bootstrap 中是否有某種方法可以使框看起來像這樣（Box1 比 Box2 稍短），同時還保持完美的原始響應(yīng)能力，使文本永遠不會夾在框外？