android - 我在垂直对齐位置为 :fixed; container 的行高文本时遇到问题

Question

我无法让这个行高在移动浏览器和其他奇怪的地方垂直居中一些文本。

在 Chrome 和 Firefox 上它工作正常并且是垂直居中的。

出于某种原因，在这个 fiddle 中，完全相同的代码不会在 chrome 中对齐中心。 http://jsfiddle.net/SEOplay/D6LtM/

如果我删除 position:fixed;左:0； top:0; 来自 #headTitle 它工作正常。

在 Android Mobile 4.0.4、用户代理、mozilla/5.0 上它工作正常并且垂直居中。

在 Android 平板电脑 4.1.2 上，相同的用户代理不起作用，并且类似于 fiddle 一样关闭(它们都使用相同的样式表)。

基本上 Chrome :是的。 火狐:是的。 Android Mobile 4.0.4:是的。 Android 平板电脑 4.1.2:否。 fiddle Chrome ？否

完整代码如下:

HTML

<div id="headTitle">
    <div id="headBtn">
        <div id="hBtn"></div>
    </div>
     <h1><a href="<?php echo get_option('home'); ?>">L'ART Magazine</a></h1>
</div>

CSS

    body {
    font-size: 10px;
    line-height:1;
    overflow:hidden;
    height:100%;
    width:100%;
    /* has to be scroll, not auto */
    -webkit-overflow-scrolling: touch;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
    div#hBtn {
        background:url('../images/icon_set.png') no-repeat -4px -53px;
        height:20px;
        width:20px;
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        margin:auto;
    }
    div#headBtn {
        position:absolute;
        width:40px;
        height:40px;
        border-right:1px solid #999;
        cursor:hand;
        cursor:pointer;
    }
    div#headTitle {
        height:40px;
        width:100%;
        text-align:center;
        background-color:#222;
        position:fixed;
        left:0;
        top:0;
        border-bottom:1px solid #ddd;
        z-index:1000;
    }
    div#headTitle a {
        color:red;
        line-height:40px;
        font-size:20px;
    }

所以怎么了？

哦，这也是一张图片

Answer 1

给 margin: 0px; 给 h1 标签

Upadetd Fiddle