다른 이미지 크기가 비대칭

Question

나는 계속 다음 한 div가 아래로 이동 : 이제 이미지의 크기에 따라

<div class="row"> 
      <div class="col-md-4 content-column"> 
      <img class="btn-center btn-desktop" src="images/buttons/btn-desktop.svg" alt="desktop button"> 
      <h2 class="btn-desktop-headline">Desktop Applikationen</h2> 
      </div> 

      <div class="col-md-4 content-column"> 
      <img class="btn-center btn-webdesign" src="images/buttons/btn-webdesign.svg" alt="webdesign button"> 
      <h2 class="btn-webdesign-headline">Webdesign</h2> 
      </div> 

      <div class="col-md-4 content-column"> 
      <img class="btn-center btn-ios" src="images/buttons/btn-ios.svg" alt="ios Logo button"> 
      <h2 class="btn-ios-headline">iOS</h2> 
      </div> 
     </div> 

, 헤드 라인 아래 여부를 추가로 이동합니다. 어떻게 해결할 수 있을까요?

Answer 1

이 문제를 해결하는 가장 좋은 방법은 전체 너비와 CSS가 지정된 높이의 div를 배치하는 것입니다. 그리고 서버 측에서 이미지를 얻는 동안 스타일 속성으로 이미지를 바인딩해야합니다.

장점은 종횡비를 어지럽히 지 않고 이미지를 늘리고 div의 가운데에 위치시킬 수 있다는 것입니다.