在div元素中居中H2

我想在#top中心h2但vertical-align:middle不起作用......我不知道該怎麼做！在div元素中居中H2

#top { 
    display: block; 
    position: relative; 
    height: 100px; 
    background-color: rgba(89,144,222,.6); 
} 
#top h2{ 
    text-shadow: 2px 2px black; 
    text-align: center; 
    color: white; 
    font-family:"Impact"; 
    font-size: 50px; 
}

效果 - http://puu.sh/2mz5M

來源

2013-03-23 Filip Bartuzi

沒有什麼不對您的CSS和您是使用最有可能出毛病了HTML。這個工作的證據可以在http://jsfiddle.net/GbGGQ/找到，這對Stack Overflow更爲理想，但更可能是重複的。 – 2013-03-23 17:56:41

你的問題不清楚：你想要水平還是垂直居中，還是兩者？你有'text-align：center;'但是提到「vert-aliignt middle」......請澄清。另外，共享HTML會有所幫助 - CSS可能是正確的，HTML可能是錯誤的，等等。 – GDav 2013-03-23 18:00:58

我明白了，你有DIV定義的高度，這對於這種情況是偉大的。你可以這樣做：

#top h2{ 
    text-shadow: 2px 2px black; 
    text-align: center; 
    color: white; 
    font-family:"Impact"; 
    font-size: 50px; 
    line-height: 100px; 
}

來源

2013-03-24 21:57:51 ceruleus

如果設置的div的line-height它應該工作。請參見方法2瀏覽：

http://phrogz.net/css/vertical-align/index.html

來源

2013-03-24 01:44:27 ftpaul

給一個固定的高度和行高度垂直對齊和文本對齊：中心到中心的文本。

#top { 
    position: relative; 
    height: 100px; 
    line-height: 100px; 
    background-color: rgba(89,144,222,.6); 
} 

    #top h2{ 
     text-shadow: 2px 2px black; 
     text-align: center; 
     color: white; 
     font-family:"Impact"; 
     font-size: 50px; 
    }

的jsfiddle：http://jsfiddle.net/XvFCT/

來源

2013-03-25 01:32:30

在div元素中居中H2

回答

相關問題