z-index无法在Safari /尝试过的webkit上运行

Question

我试过-webkit-transform：translateZ（10px）;但也没有工作。它适用于桌面，Chrome等。我无法弄清楚如何解决...

HTML - 绿色部分

     <div class="navbar-collapse collapse in" id="bs-example-navbar-collapse-1" aria-expanded="true">


      <ul id="menu-header" class="nav navbar-nav center"><li id="menu-item-202" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-202 active "><a href="http://creativefiesta.com/">Home</a></li>
                <li id="menu-item-206" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-206"><a href="#work">How does it work?</a></li>
                <li id="menu-item-207" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-207"><a href="#portfolio">Portfolio</a></li>
                <li id="menu-item-208" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-208"><a href="#pricing">Pricing</a></li>
                <li id="menu-item-209" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-209"><a href="#contact">Contact</a></li>
                </ul>        <ul class="nav navbar-nav navbar-right">

                            <li>
  </div>

CSS

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
z-index: 10 !important;
-webkit-transform:translateZ(10px);
position: absolute;
}
.col-sm-6 {z-index: -10 !important; position: relative;}

}

Answer 1

添加此

-webkit-transform：translate3d（0,0,0）;