열에 이미지 중심 맞추기 - 부트 스트랩 4

Question

이것은 항상 어려움을 겪고있는 것처럼 보이는 질문이며 쉬운 대답을 찾지 못했습니다. 부트 스트랩 그리드 내부에 이미지 나 다른 블록 요소를 가운데에 배치하기 만하면됩니다. 여백 : 자동이 거의 작동하지 않는 것 같습니다.

<!-- Services Section --> 
    <div class ="container" id="services"> 
     <h2>My Service</h2> 
     <div class="row"> 
      <div class="col-sm-4"> 
       <img src="img/wordpress.png"> 
      </div> 
      <div class="col-sm-4"> 
       <img src="img/js.png"> 
      </div> 
      <div class="col-sm-4"> 
       <img src="img/rails64.png"> 
      </div> 

     </div> <!-- end row --> 
    </div> <!-- end container services --> 

Answer 1

이 도구를 사용하면 요소를 가로 및 세로 가운데에 배치 할 수 있습니다.

.centerImage{ 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
} 

이 클래스를 부모를 중심으로 정렬 할 수있는 이미지에 적용하십시오.

도와주세요.