正しいliの高さ

Question

私はブートストラップを使用し、私はhtmlコードを持っています。 - 私はしないようにすることができ、画像の背景

リスト項目

コンテンツだけ

しかし、私は問題を抱えていると

1. ：私は、Liの2種類を持つようにしたいです画像を持つliの高さを設定する。bg =コンテンツのあるliの高さ。

   <div class="row"> 
       <ul class="block-list"> 
        <li class="col-md-3 col-sm-12 info-section-grid-colored-1"></li> 
        <li class="col-md-3 info-grid-section-ncl"> 
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, 
          sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
         </p> 
        </li> 
        <li class="col-md-3 col-sm-12 info-section-grid-colored-1"></li> 
        <li class="col-md-3 col-sm-12 info-grid-section-ncl"> 
         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, 
          sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
         </p> 
        </li> 
       </ul> 
   </div> 
   

   マイCSS：

   .block-list { 
   padding-left: 0; 
   } 
   
   .block-list li { 
   position: relative; 
   float: left; 
   height: 100%; 
   } 
   
   .info-section-grid-colored-1 { 
   background: url(../images/1.jpg) center no-repeat; 
   background-size: cover; 
   padding: 50px 40px; 
   height: 100%; 
   float: none; 
   display: table-cell; 
   border: none; 
   } 
   
   .info-grid-section-ncl { 
   padding: 50px 40px; 
   float: none; 
   display: table-cell; 
   border: none; 
   text-align: center; 
   } 
   

Answer 1

は、このようなすべてのliタグの固定の高さを試してみてください。

.block-list li { 
    position: relative; 
    float: left; 
    height: 50px; 
}