叠加下拉内容CSS

Question

我有一个条形栏，当鼠标悬停在它上面时会显示带有一些数据的下拉列表。它工作正常。但在实现滑块代码后，此下拉列表会滚动。

部分包含30个高度的显示。但我想在其他div上显示那些下拉列表。

当我删除netstandard1.3时，它工作正常但是时间屏幕看起来不太好。

我尝试使用overflow-x: hidden，溢出但没有成功。

HTML

z-index

CSS

<div id="container">
    <div id="parent">
        <div class="contentBlock">1</div>
        <div class="contentBlock">2</div>
        <div class="contentBlock">3</div>
        <div class="contentBlock">4</div>
        <div class="contentBlock">5</div>
    </div>
</div>
<span id="panLeft" class="panner" data-scroll-modifier='-1'>Left</span>

<span id="panRight" class="panner" data-scroll-modifier='1'>Right</span>

JAVASCRIPT

#container{
    width:600px;
    overflow-x:hidden;
}

#parent {
    width:6000px;
}
.contentBlock {
    font-size:10em;
    text-align:center;
    line-height:400px;
    height:400px;
    width:500px;
    margin:10px;
    border:1px solid black;
    float:left;
}
.panner {
    border:1px solid black;
    display:block;
    position:fixed;
    width:50px;
    height:50px;
    top:45%;
}
.active {
    color:red;
}
#panLeft {
    left:0px;
}
#panRight {
    right:0px;
}