我的垂直导航栏位于水平导航栏的顶部，即使使用CSS的z索引更大？

我在使用CSS时遇到问题，我正在与一个团队合作一个react项目，我正在使用react构建一个左菜单，它已经完成，但我还有一个小问题，就是我的左菜单位于网页主菜单的顶部，我将用图片解释更多内容， 以下是我第一次打开网页时的情况：

但当我向下滚动时，我看到的是：

但这不是我想要的，我想要的是水平导航在顶部，像这样：

我遇到的另一个问题是，我无法修改水平导航栏的CSS，因为我不是制作它的人，我不知道他为什么要按设置属性值的方式设置属性值，但这是我的SASS文件：

（我的左侧菜单SASS文件）：

这是我的反应组件：

class MenuLeft extends Component {


  /* 
   *    Here is some methods and constructor that are not useful in the situation 
  */
  render() {
    return (
        <div className="co-menu">
            <div className={"co-menu-left co-menu-left" + this.state.position}>
                <Grid container>
                    {this.state.contratItems.map(item => (
                        <ContratProposition
                            key={item.id}
                            id={item.id}
                            allContratDeselected={this.allContratDeselected}
                            isSelected={item.isSelected}
                        />
                    ))}
                    <Grid item xs={12} className="pt-0" />
                </Grid>

                {this.renderItems(this.state.menuItems)}
            </div>
        </div>
    );
}
}

export default MenuLeft;

类菜单扩展组件{
/* 
*下面是一些在这种情况下不有用的方法和构造函数
*/
render（）{
返回(
{this.state.contractitems.map（项=>(
))}
{this.renderItems（this.state.menuItems）}
);
}
}
导出默认菜单；

如你所见，我将z-索引设置为负值，这样我的LeftMenu就可以位于底部，因为当我检查水平导航栏（白色）时，我可以看到：

我的想法是，如果我将z-index值设置为小于10的值，那么一切都会很好，但这似乎不起作用

---

任何帮助都将不胜感激。

基本

.co主容器.co-modal ui-container

元素的样式是什么（不是

：：before

伪元素）？基本

.co主容器.co-modal ui-container

元素的样式是什么（不是

：：before

伪元素）？

class MenuLeft extends Component {


  /* 
   *    Here is some methods and constructor that are not useful in the situation 
  */
  render() {
    return (
        <div className="co-menu">
            <div className={"co-menu-left co-menu-left" + this.state.position}>
                <Grid container>
                    {this.state.contratItems.map(item => (
                        <ContratProposition
                            key={item.id}
                            id={item.id}
                            allContratDeselected={this.allContratDeselected}
                            isSelected={item.isSelected}
                        />
                    ))}
                    <Grid item xs={12} className="pt-0" />
                </Grid>

                {this.renderItems(this.state.menuItems)}
            </div>
        </div>
    );
}
}

export default MenuLeft;