Область заголовка div не выравнивается по центру внутри заголовка div

Question

У меня есть заголовок 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

попробовать добавить Левое поле: значение; класс подписи. для примера margin-left: 10%;