부트 스트랩없이 순수 CSS를 사용하여 두 div를 센터링하는 방법은 무엇입니까?

Question

Flexbox를 사용하여이 작업을 수행 할 수 있지만 Bootstrap이로드되지 않는 매우 가벼운 전자 상거래 사이트 (특히 Shopify 테마)에서 작업 할 때 특히 간단하게 단순 CSS를 사용하기를 원할 때가 있습니다.

CSS를 사용하면 어떻게 효과를 낼 수 있습니까?

<center> 
    <table> 
    <tr> 
     <td> 
     <div> 
      <img ... /> 
      <br /> 
      <label ... /> 
     </div> 
     </td> 
     <td> 
     <div> 
      <img ... /> 
      <br /> 
      <label ... /> 
     </div> 
     </td> 
    </tr> 
    </table> 
</center> 

(원유 예, 그러나 희망이 걸쳐 포인트를 얻을 수 있습니다.)

Answer 1

당신은 자동으로 사업부에 대한 마진의를 설정해야합니다. 그러면 div가 부모 컨테이너의 가운데에 배치됩니다.

div { 
    margin: 0 auto; 
    width: 100px; 
}