너비를 지정하지 않을 때 부모 div 내에서 가운데 ​​정렬 된 자식 div를 센터

Question

다른 div 내에 컨테이너 div를 가운데에 놓고 싶습니다. 그리고 컨테이너의 자식 div도 가운데에 맞춰야하지만 왼쪽으로 정렬해야합니다. 하위 div는 가변적이고 예측할 수없는 너비입니다. 예를 들어

는 :

<div> 
    <div class="container"> 
     <div class="child"><img />Text</div> 
     <div class="child"><img />Text Widest</div> 
     <div class="child"><img />T</div> 
    </div> 
</div> 

나는 파이어 폭스에서 작동하는 솔루션을 찾았지만, 보편적 인 솔루션이 필요합니다. 또한 JavaScript를 사용하여 이미지, 텍스트 및 div를 측정하는 방법을 고려해 보았습니다. 그러나 저는 CSS가 무식하다는 확신을 가지고 간단하고 우아한 해결책이 있습니다.

는

.container { 
    width: -moz-max-content; 
    margin: 0px auto 0px auto; 
    border-style: solid; 
} 

.child { 
    border-style: solid; 
    margin: 0px auto 0px auto; 
} 

Answer 1

.container { 
    display: table; 
    margin: 0 auto; 
} 
.container > .child { 
    display: table-cell; 
}