Javascript 如何使用overflow-y visible和overflow-x在div中滚动？

如何使用

overflow-x:scroll

编码

overflow-y:visible

按钮的数量可能会有所不同，当按钮太多时，它们会水平滚动。如果我单击了下拉按钮，那么我想在

div

中使

overflow-y:visible

。但是现在，下拉列表隐藏在

div

中

我该如何改变

我的代码部分

html

  <div class="container-fluid fill-height">
      <div class="navbar navbar-expand scroll" role="group">
        <div class="dropdown">
          <button type="button" class="btn btn-default dropdown-toggle" id="testDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</button>
          <div class="dropdown-menu" aria-labelledby="testDropdown">
            <a class="dropdown-item" href="#">Menu</a>
          </div>
        </div>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
        <button type="button" class="btn btn-default">BUTTON</button>
      </div>
    </div>

最后一件事：

从bootstrap官方文档（）： 可能需要额外定位 下拉列表通过CSS自动定位在文档的正常流程中。这意味着下拉列表可能会被具有某些溢出属性的父对象裁剪，或者显示在视口的边界之外。当这些问题出现时，请自行解决

https://github.com/davidstutz/bootstrap-multiselect/issues/411
https://www.bootply.com/YvePJTDzI0

---

这是codepen。你的密码在哪里？@core114你没看见我的密码笔吗？

https://github.com/davidstutz/bootstrap-multiselect/issues/411
https://www.bootply.com/YvePJTDzI0