Html 位置固定时，收割台将消失

当我将

position:fixed

设置到我的标题时，它消失了，我也不知道为什么。这是我的密码：

html，
身体{
身高：100%；
宽度：100%；
保证金：0；
填充：0；
}
桌子{
边界塌陷：塌陷；
边界间距：0；
}
#标题{
位置：固定；
}
#标题{
浮动：左；
}
#标题导航{
浮动：对；
}
.内容容器{
宽度：100%；
栏目：3个；
-webkit栏目：3个；
/*狩猎与铬*/
-moz列：3列；
/*火狐*/
柱间距：0px；
-moz柱间距：0px；
-webkit柱间隙：0px；
列填充：平衡|自动；
}
.邮政{
显示：块；
位置：相对位置；
}
.后img{
宽度：100%；
高度：自动；
显示：块；
}
.后h2{
位置：绝对位置；
显示：无；
最高：50%；
文本对齐：居中；
保证金：0自动；
宽度：100%；
颜色：#000；
字体系列：“Raleway”，无衬线；
字体大小：14px；
文本转换：大写；
字号：500；
}
.post:悬停img{
不透明度：0.15；
}
.post:悬停h2{
显示：块；
}

标题
菜单
你好
你好
你好

将DOM节点设置为固定将其从正常文档流中删除

您应该使用以下CSS将标题设置为固定高度，并使用与内容容器填充相同的高度（因为它不会向下推内容容器，因为它已从正常文档流中删除）。请注意，在本例中，两者都有20px

#header {
    position: fixed;
    background-color: red;
    width: 100%;
    height: 20px;
    z-index: 10;
}

.content-container {
    padding-top: 20px;
}

---

请参阅JSFIDLE以获取完整的工作示例：

尝试添加转换方法translateZ（0），当然，这并不能解决100%浏览器的问题，但我发现它是100%有效的

#header {
    position: fixed;
    background-color: red;
    width: 100%;
    height: 20px;
    z-index: 10;
    top: 0;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

---

您对哪些浏览器（和版本）有问题？你也可以发布html（或者你已经隔离的有问题的部分）？@homer6chrome，safari和Firefox。当我将鼠标悬停在流的第一个（左上）图像上时，页面标题和菜单项出现。但它出现在图像的顶部，浮动被破坏，在内容容器之前/顶部它不“需要自己的空间”。。。