2つの列を持つ行を作成する

Question

次のコードでは、各セクションが1つの列に属する2つの列を持つ行を作成しようとしていました。成功できませんでした。

<div class="container"> 
     <section> 
      <div class="row"> 
       <div class="col-lg-6"> 
        <section> 
         <h2>THIS is heading 2.1</h2> 
         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore eveniet distinctio non, dolor asperiores ducimus quidem. Tempore exercitationem, velit magnam beatae quia, similique, eaque aliquam provident inventore iste et sequi!</p> 
        </section> 

        <section> 
         <h2>THIS is heading 2.2</h2> 
         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore eveniet distinctio non, dolor asperiores ducimus quidem. Tempore exercitationem, velit magnam beatae quia, similique, eaque aliquam provident inventore iste et sequi!</p> 
        </section> 
       </div>  
     </div><!-- row --> 
     </section> 
    </div><!-- end of container --> 

どのように問題を解決できますか？

Answer 1

セクションを列に属するようにする場合は、セクションを列に挿入します。 2番目のセクションの手順を繰り返します。あなたはこのロジックを持つことにより、行の2つの列を持つことができます

：

row 
    column 
    section 
    column 
    section 

決勝コード：

<div class="container"> 
    <section> 
     <div class="row"> 
     <!---- First section in the first column  ---------> 
      <div class="col-lg-6"> 
       <section> 
        <h2>THIS is heading 2.1</h2> 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore eveniet distinctio non, dolor asperiores ducimus quidem. Tempore exercitationem, velit magnam beatae quia, similique, eaque aliquam provident inventore iste et sequi!</p> 
       </section> 
      </div> 

     <!---- Second section in the second column  ---------> 
      <div class="col-lg-6"> 
       <section> 
        <h2>THIS is heading 2.2</h2> 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore eveniet distinctio non, dolor asperiores ducimus quidem. Tempore exercitationem, velit magnam beatae quia, similique, eaque aliquam provident inventore iste et sequi!</p> 
       </section> 
      </div>  
    </div><!-- row --> 
    </section> 

Answer 2

を、あなたは複数の列が内部sectionを使用するためdivを使用している必要がありますdiv。

<div class="row"> 
    <!-- First section ---> 
     <div class="col-sm-6"> 
      <section> 
       <h1>first section</h1> 
      </section> 
     </div> 

    <!-- Second section --> 
     <div class="col-sm-6"> 
      <section> 
       <h1>second section</h1>  
      </section> 
     </div>  
    </div>