Html Z-Index在firefox中不工作，将更改为：transform css

我有一个固定的标题，在Safari和Chrome中滚动到每个其他元素的上方，但在firefox中，有些元素（不是全部）保持在标题上方。例如，一些img在上面，而其他img在下面（都在.main content div中）。我已经将问题缩小到一个名为.is的类，该类由抽屉移动，其将更改：transform属性。有没有办法解决这个问题

这是一个密码笔：

---

它解决了标题凌驾于其他所有z-index问题，但.main内容中的所有元素都变得不可读取。

是否将正文和html显示为内联？“那该怎么办？”迈克尔？你介意详细解释一下吗？有问题的元素有位置，所以我不认为这是问题所在…@Pevara，

。主要内容

没有定位。你能再发布一些html吗？这些元素都没有内容，也没有关闭。是否将正文和html显示为内联？“那该怎么办？”迈克尔？你介意详细解释一下吗？有问题的元素有位置，所以我不认为这是问题所在…@Pevara，

。主要内容

没有定位。你能再发布一些html吗？这些元素都没有内容，也没有关闭。

<div id="PageContainer" class="is-moved-by-drawer">
  <header class="site-header" role="banner" style="position: fixed; max-height: 93px;">
  <nav class="nav-bar large--hide" role="navigation">
  <main class="wrapper main-content" role="main" style="padding-top: 123px;">
  <footer class="site-footer small--text-center" role="contentinfo">
</div>

.is-moved-by-drawer {
    transition: all 0.4s cubic-bezier(0.46, 0.01, 0.32, 1) 0s;
    will-change: transform;
}

html, body, #PageContainer {
    display: inline;
    height: 100%;
    margin: 0;
    min-height: 100% !important;
}

.site-header {
  background: #000 none repeat scroll 0 0;
  position: fixed;
  transition: all 0.3s ease 0s;
  z-index: 999999;
}

.main-content {
    display: block;
    padding-bottom: 60px;
    padding-top: 30px;
}

.main-content {
    display:block
    padding-bottom: 60px;
    padding-top: 30px;
    position: relative;
    z-index: -1;
}