ブートストラップはサイズのないカラムをラップしません

Question

私はブートストラップグリッドのウェブサイトを作成して、それについてもう少し詳しく教えています。私はhereと書かれた内容を読んで、そのページから例を作り始めました。

非常に最初の例で私は問題に遭遇しました。主に「サイズ」を持たない列の「振る舞い」が、サイズが同じになり、1行を占めるということです。そのよう

：

はしかし、私が代わりに取得することはこれです：色

とパディングのビットが唯一のものであるI上にリンクされたページiの例からコピーしたベースラインのHTML/CSSページに追加しました。これは余分なCSSです：

.row{ 
    /*background-color: lightblue;*/ 
    border: 3px solid rgba(86,61,124,.2); 
} 
.row>.col{ 
    padding-top: .75rem; 
    padding-bottom: .75rem; 
    background-color: rgba(86,61,124,.15); 
    border: 1px solid rgba(86,61,124,.2); 
} 

ブートストラップCSSは、JSとjQueryは、すべてのCDN提案W3Schoolsのから撮影されています。

help plsの例に示すように、私の列が互いに積み重なりたくない理由はわかりません。

Answer 1

それは何も変更せずに実行している - ここであなたは、ブートストラップ4アルファ（[4でコードのbootply]（HTTPSのドキュメントを読んでいるようBootstrap-v4

.row { 
 
    /*background-color: lightblue;*/ 
 
    border: 3px solid rgba(86,61,124,.2); 
 
} 
 
.row > .col { 
 
    padding-top: .75rem; 
 
    padding-bottom: .75rem; 
 
    background-color: rgba(86,61,124,.15); 
 
    border: 1px solid rgba(86,61,124,.2); 
 
}

<link href="https://v4-alpha.getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col"> 
 
     1 of 2 
 
    </div> 
 
    <div class="col"> 
 
     1 of 2 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="col"> 
 
     1 of 3 
 
    </div> 
 
    <div class="col"> 
 
     1 of 3 
 
    </div> 
 
    <div class="col"> 
 
     1 of 3 
 
    </div> 
 
    </div> 
 
</div>