Javascript 如何使浮动滚动条（方便滚动）与LitElement一起工作？

好吧，我不知道问题出在LitElement上，但这是我能想到的唯一可能打破它的东西

我正在尝试使用浮动滚动条。我想垂直滚动图例和图表（它们在水平方向上彼此相邻，图例与地理地图的图例相同），并使图表上的浮动滚动条能够水平滚动图表。设置如下所示：

<link rel="stylesheet" type="text/css" href="/dist/bundle.css">
<div class="" style="overflow-y: scroll; overflow-x: hidden; height: 200px;">
    <lv-legend style="display: inline-block;"></lv-legend>
    <div id="handscrolls" style="display: inline-block;">
        <lv-diagram style="display: inline-block; width: 500px;"></lv-diagram>
    </div>
</div>
<lv-menu style="display: block;"></lv-menu>

我尝试了各种各样的排列方式来安装handyScroll，但它就是不想工作

它确实作为

的子类附加，类为

class=“handy scroll handy scroll hidden”

，高度为0。但它不可用，也不显示

它似乎也打破了我的宽度限制，很高兴地将图表显示在屏幕右侧

即使你没有解决方案，在这一点上，任何想法都是受欢迎的。谢谢你抽出时间

updated(changedProperties) {
    let handscrollsContainer = this.shadowRoot.getElementById("handscrolls");
    handyScroll.update(handscrollsContainer);
}

firstUpdated(changedProperties) {
    let handscrollsContainer = this.shadowRoot.getElementById("handscrolls");
    handyScroll.mount(handscrollsContainer);
    console.log("the mounting was successful: "+ handyScroll.mounted(handscrollsContainer));
}