캡션 영역 div가 가운데에 정렬되지 않았습니다. 머리글 div 내에

Question

헤더 div가 있고 여기에 캡션 div가 있습니다. 캡션 div를 가운데 정렬하려고합니다. 현재 캡션 div는 왼쪽에 맞춰져 있습니다. 나는 믿을 수 없을 정도로 어둡지 만, 하루 종일 코드를보고 있었기 때문에 내 마음이 튀었습니다.

HTML

<div class="wrapper"> 
    <div id="header"> 
    <div class="caption">First Caption - Health & Safety</div> 
    </div> 
</div> 

CSS

#header { 
position:relative; 
width:1200px; 
height:400px; 
margin:auto; 
border:1px solid red; 
} 

.caption { 
position:absolute; 
width:1000px; 
height:140px; 
background-color: red; 
margin: auto; 
} 

Answer 1

PLS는 여백에서 왼쪽으로 추가 할 수있는

position:absolute; 

Answer 2

시도 제거하려고 : 값을; 캡션 클래스에. 예 : 여유분 - 왼쪽 : 10 %;