CSS标头固定位置

我有一个横跨五个页面宽度水平滚动的网站。我希望页眉在页面水平滚动时保持固定在相同的位置。在Safari中，标题与CSS规则保持一致，“position：fixed”。但是，在Firefox，Chrome和IE中，标题会随页面一起滚动。有没有更容易的方法比从每个页面的包装中拉出标题？代码很复杂，所以我想避免将它拉到外面。CSS标头固定位置

<div id="page1"> 
    <div class="header"></div> 
</div> 
<div id="page2"> 
    <div class="header"></div> 
</div> 
<div id="page3"> 
    <div class="header"></div> 
</div>

.header { 
    width:100%; 
    height:110px; 
    background-color: rgba(43, 77, 105, .6); 
    z-index: 10; 
    position: fixed; 
    top:0; 
}

来源

2015-02-10 The Hawk

你试过把左：0？可能是有用的 – 2015-02-10 15:06:00

它在我的Firefox上使用这个小提琴工作http://jsfiddle.net/oc8ywqg3/ – nanndoj 2015-02-10 15:07:53

@PravinVaichal这样做了。把它作为答案，我会给你信用。 – 2015-02-10 15:09:13

你可以尝试添加left:0属性.header类来解决这个问题

编码快乐:)

来源

2015-02-10 15:12:49

CSS标头固定位置

回答

相关问题