在標題元素中居中對齊內容

如何在div中對齊img和h1？現在我在頁眉有一個PNG和一個h1，但內容自動在左上角。我如何把它放在中間並保持響應？這裏是我的HTML：在標題元素中居中對齊內容

<header> 
     <h1 id="title">Lorem Ipsum</h1> 

     <img id="arrows" src="images/arrows.png"> 
     <h3 id="sub-title">Lorem ipsum</h3> 
    </header>

來源

2015-07-02 pat

這是你想要的東西：http://jsfiddle.net/sjmcpherso/3ystho4v/

header{text-align:center;position:relative} 
header h3{position:absolute;left:0;top:0;}

來源

2015-07-02 23:30:23 sjm

您可以再補充text-align: center父元素。它也很敏感。

header { 
 
    text-align: center; 
 
}

<header> 
 
    <h1 id="title">Lorem Ipsum</h1> 
 
    <img id="arrows" src="http://placehold.it/100x100" /> 
 
    <h3 id="sub-title">Lorem ipsum</h3> 
 
</header>

來源

2015-07-02 23:32:12

謝謝！我如何垂直居中？ – pat

你可以嘗試打開一個新的問題，因爲它改變了答案和問題的整個上下文:) –

你可以用在一個div的H1和IMG。從div你可以做margin：0 auto;這將集中H1和IMG

div{ margin: 0 auto; text-align: center; }

來源

2015-07-02 23:32:17 Hak

使用CSS

header { 
    text-align: center; 
}

來源

2015-07-02 23:33:26

在標題元素中居中對齊內容

回答

相關問題