位置固定不适用于标题 [英] Position Fixed Not Working for Header

问题描述

我想创建一个非常简单的效果，当您向下滚动页面时，导航将停留在页面的顶部。所有我应该做的是设置位置：固定的标题，我目前有。出于某种原因，它更像是一个位置：绝对元素对固定。我试着在页面上的其他元素具有相同的效果，所以我必须有一些在我的HTML或CSS代码，导致的问题。任何想法？

I am trying to create a very simple effect where the navigation sticks to the top of the page as you scroll down the page. All I should have to do is set "position: fixed" to the header, which I currently have. For some reason, it's treating it more like a "position: absolute" element vs. fixed. I tried it on other elements on the page with the same effect, so I must have something that in my HTML or CSS code that is causing the issue. Any ideas?

http://jsfiddle.net / apautler / yDhXG / 1 / embedded / result /

标题CSS

.nav-main  {overflow: visible; position: fixed;
            top: 0; left: 0; right: 0; height: 60px; width: 100%;}

注意，网站是响应式的，因此<$ c

Note, the site is responsive, so the position: fixed kicks in at 768px.

推荐答案

目前， ， Chrome无法在元素上呈现 position：fixed 在转型下。删除（无内容）

At the moment, Chrome cannot render position:fixed on elements under a transformation. Delete the (content-free)

-webkit-transform: translate3d(0, 0, 0);

和它将工作。

这篇关于位置固定不适用于标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！