将h1置于具有背景颜色的div中

Question

我无法在我的div中心对齐我的h1标签。 div只显示一个颜色块，h1应该适合中心，现在它位于顶部。

http://jsfiddle.net/ha632/

HTML

<div id='title' align="center">
    <h1>ExpressWay</h1>
</div>

CSS

#title{
    background-color: #f5f82e;
    height: 20%;
    text-align: center;
}

Answer 1

你的margins are collapsing。您可以通过向您的div添加overflow:auto（或类似border:1px solid #f5f82e的边框）来解决此问题：

#title{
    background-color: #f5f82e;
    height: 20%;
    text-align: center;
    overflow:auto;
}

<强> jsFiddle example

Answer 2

试试这个css：

#title{
    background-color: #f5f82e;
    height: 20%;
    text-align: center;
    padding: 10px;
}

h1 {
    margin: 0;
    padding: 0;

}

您可以使用#title的填充值。

Answer 3

给你的h1一个行高或添加填充。

更好的解决方案是完全删除div并将您的样式应用到h1代码，除非您有充分理由div？

示例：http://jsfiddle.net/Y6zew/2/