Boostrap 4 spacing、バージョン3のようにボタンに垂直スペースがないのはなぜですか？

Question

版3レイアウト（https://plnkr.co/edit/XDA9EwMAzH4xDSfZaXvS?p=preview）

<div class="container"> 
    <h1>Confirm your details</h1> 
    <div class="row"> 
    <div class="col-md-12"> 
     <div class="panel"> 
      <h4 class="panel-heading">We need to confirm your current address details and contact information.</h4> 
      <p class="panel-body">With supporting text below as a natural lead-in to additional content.</p> 
     </div> 
    </div> 
    </div> 
    <div class="row"> 
    <div class="col-md-12 text-right"> 
     <p> 
     <a href="#" class="btn btn-primary">Confirm</a> 
     </p> 
    </div> 
    </div> 
</div> 

版4レイアウト（https://plnkr.co/edit/LDy00Kk6eVHDq85ZqjgQ?p=preview）

<div class="container"> 
    <h1>Confirm your details</h1> 
    <div class="row"> 
    <div class="col"> 
     <div class="card"> 
     <div class="card-block"> 
      <h4 class="card-title">We need to confirm your current address details and contact information.</h4> 
      <p class="card-text">With supporting text below as a natural lead-in to additional content.</p> 
     </div> 
     </div> 
    </div> 
    </div> 
    <div class="row"> 
    <div class="col-md-12 text-right"> 
     <p> 
     <a href="#" class="btn btn-primary">Confirm</a> 
     </p> 
    </div> 
    </div> 
</div> 

なぜボタンが縦方向のスペースを持っていないと私はそれがブートストラップV4にどのように追加する必要がありますか？

Answer 1

：

https://v4-alpha.getbootstrap.com/utilities/spacing/

は基本的に、彼らはあなたが画面のサイズに応じて異なる量を追加できるようにマージンやパディングを追加するための表記法を追加しました。例えば、私は（'-sm'）小型スクリーン用のdivの上部（'T'）にマージン（'はM'）を追加します。私はまた、（「-3」）それは、デフォルトの間隔になりたい：

<div class="mt-sm-3"> <!-- footer nav --> 
    <a class="btn btn-primary" href="#">Confirm</a> 
</div> 

更新plnker：https://plnkr.co/edit/LDy00Kk6eVHDq85ZqjgQ?p=preview

Answer 2

は"Migrating to v4 - Bootstrap 4"パネルが落ちてきた。このリンクによれば、擬似的なHRとその下のマージン/パディングを提供しているパネルです。それが今のカードを使っているので

、私はあなたがその余分なCSSフォーマットを失ってしまったし、それだけで前のカードの周りに余白を適用する場合になるだろうと思っています。

注意してください：「マージントップを避け垂直マージンは、予期しない結果をもたらす、折りたたむことができます。。」その答えが見つかりBoostrap Reboot Approach