CSS div düzeni düzeltmesi

Question

Boşluklarımın düzeniyle ilgili bir sorunum var, CSS becerilerimi bir düzen oluşturuyorum ama tutarlı bir soruna rastlıyorum. Çünkü açıklamakta zorlanıyorum çünkü kod ile bir resim vereceğim.

Kod

kodu, sahip olduğum sorundur (bu onların adlandırma kuralları kullanılan sadece ive Btw Bootstrap değildir) iki "Col-lg-3" sınıfların oluşur

<div class="section-small pattern-triangles drop-shadow"> 
    <div class="container"> 
     <div class="col-lg-3 grey-text"> 
      <div class="footer-title"> 
       <h3>Contact Us</h3> 
      </div> 
      <div class="footer-body"> 
       <ul class="footer-li"> 
        <li>England, Leicester</li> 
        <li>ikdevelopment@hotmail.com</li> 
        <li>07940033706</li> 
       </ul> 
      </div> 
     </div> 
     <div class="col-lg-3 grey-text red-border"> 
      <div class="footer-title red-border" style="position: static"> 
       <h3>More</h3> 
      </div> 
      <div class="footer-body red-border"> 
       <ul class="footer-li"> 
        <li>Blog</li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 

o listede ise Sütun içinde aynı miktarda ürün yoksa, aşağıda olduğu gibi bir yükseklik sorunu vardır. Bu sorun aşağıdaki tüm css kodu bağlı olduğu accros

Eminim diğerleri geldi.

.footer-li { 
    list-style-type: none; 
    padding: 0; 
    margin-left: 0; 
    margin-bottom: 5px; 
} 

.footer-li li{ 
    margin-bottom: 10px; 
} 

.col-lg-3{ 
    color: black; 
    width: 33%; 
    padding: 10px; 
    display: inline-block; 
} 

Answer 1

Her iki konteynır öğesinin solunda yüzmeniz gerekir.

.grey-text{ float:left; } 

Answer 2

kullanımını yerine display:inline-block ait float:left:

Daima

.col-lg-3{ 
    color: black; 
    width: 33%; 
    padding: 10px; 
    float:left; 
}