html - 固定标题图标重叠

Question

我有以下屏幕，我有一个进度条，它的图标被重叠并且它扰乱了导航栏。

进度条CSS：

ol.progtrckr li {
    display: inline-block;
    text-align: center;
    line-height: 3em;
}
ol.progtrckr li:before {
    overflow:hidden;
    position: relative;
    bottom: -2.5em;
    float: left;
    left: 50%;
    line-height: 1em;
}

导航栏CSS：

#navwrapper {
margin:0 auto;
background-color: #3A87AD;
position: fixed;
width: 100%;
}

Answer 1

将 a 应用z-index到您的导航栏。

#navwrapper {
    z-index: 100;
    ....
}

较大的元素与z-index其他元素重叠。

有关更多信息，请查看z-index-MDN。