해상도를 변경하면 가운데에 머물러있는 div 그룹을 중심에 배치하는 방법

Question

학교용 웹 사이트를 만들어야하고이 div를 가운데에 정렬하는 방법을 알고 싶습니다. 이제는 무엇이든 동일하게 유지되지만 브라우저 창을 확대하면 페이지의 맨 아래에 그룹으로 유지됩니다. 누구든지 나를 도울 수 있습니까?

<div id="thing 1"> 
    <div style="position: absolute; bottom: 0px; left: 220px; width: 300px;"> 
    <img border="0" src="thing 1" alt="awesome thing 1" width="296,4" height="464,5"> 
</div> 

<div id="thing 2"> 
    <div style="position: absolute; bottom: 0px; left: 470px; width: 300px;"> 
    <img border="0" src="thing 2" alt="awesome thing 2" width="228" height="357,3"> 
</div> 

<div id="thing 3"> 
    <div style="position: absolute; bottom: 0px; left: 700px; width: 300px;"> 
    <img border="0" src="thing 3" alt="awesome thing 3" width="90" height="400"> 
</div> 

<div id="thing 4"> 
    <div style="position: absolute; bottom: 0px; left: 820px; width: 300px;"> 
    <img border="0" src="thing 4" alt="awesome thing 4" width="200" height="380"> 
</div> 

Answer 1

하나 개 사업부에서 이미지를 떠나 그것에 text-align: center 스타일을 추가하면된다 :

HTML :

<div id="thing_1"> 
    <img border="0" src="thing 1" alt="awesome thing 1" width="296,4" height="464,5"> 
    <img border="0" src="thing 2" alt="awesome thing 2" width="228" height="357,3"> 
    <img border="0" src="thing 3" alt="awesome thing 3" width="90" height="400"> 
    <img border="0" src="thing 4" alt="awesome thing 4" width="200" height="380"> 
</div> 

CSS :

#thing_1 { 
    text-align: center; 
} 

Example

Answer 2

.mydivs { 
    display: inline-block; 
    margin: auto; 
    width: 50px; /*some fixed width*/ 
} 

/* centered equidistantly */