在iOS上的粘性位置顶部有边距

时间:2018-07-30 22:17:18

标签: html ios css

我正尝试使用新位置“粘性”来做导航栏,并且我做了粘性的定义以避免safari的问题,但是我遇到了另一个问题,我发现页面和导航栏的边界之间有这样的空间

enter image description here

还有我的CSS代码

.nav-heder {
position: sticky;
position: -webkit-sticky; /* Safari */
top: 0;
background-color: #f5f5f5;
z-index: 5;
height: 60px;
padding: 15px 0px 10px 0px;
}
.margin-bottom-sm { margin-bottom: 1em; }
.container{
    /* padding-top: 20px; */
}

这是html cose

<div class="container">
    <!-- header ,tools.back to ,title of page -->
    <div class="row margin-bottom-sm nav-heder">
        <div class="col-lg-3 col-md-3 col-xs-3 "><a href="#" class="webviewClose"><img src="./assets/images/arrow-left.png" srcset="./assets/images/arrow-left@3x.png 1000w"></a></div>
        <div class="col-lg-6 col-md-6 col-xs-6 text-md bold text-center"> Your Prizes </div>
        <div class="col-lg-3 col-md-3 col-xs-3 text-right bold"><div class="col-lg-3 col-md-3 col-xs-3 text-right bold"><a href="#" id="address-book"><img src="./assets/images/contactscopy2.png" srcset="./assets/images/contactscopy2@3x.png 1000w"></a></div></div>
    </div>

    <!-- content of page -->
    <div class="content"></div>

0 个答案:

没有答案