html - Chrome 选择/下拉控件缺少边框 - 最新的 Chrome (69.0.3497)、Windows 10

Question

我们使用的是最新的 Chrome 和 Windows 10，

69.0.3497.100 (Official Build) (32-bit)

在某些监视器上，有一个缺少边框的选择/下拉控件。有时是正确的；然后当我玩宽度(让它成为 px 而不是百分比，添加更多宽度)时，它变成了底部。

但在其他显示器上，此选择/下拉列表始终没问题。它总是有所有的边界。从来没有任何问题。

所有显示器的分辨率均为 1920 x 1200(在 Windows 10 中推荐)，无论是否存在此问题。测试了不同的缩放比例——100%、80%、120%。有些用户(总是)遇到这个问题，或者他们(永远)没有，所有用户都使用相同的浏览器，在任何缩放级别。

控件上没有特殊的 CSS 样式。事实上，即使我要添加一个 border: 1px solid 它也不会影响系统选择区域。它只会影响顶层框。

我能找到的最接近的是 Chrome 很久以前就有一个错误，比如 2012 年，但它早就被修复了，所以我们不能使用这个信息。

Chrome isn't displaying borders (sometimes)

有什么想法吗？

Answer 1

添加另一个包装器 div 帮助我解决了这个问题。

<div class="dropdown-menu-container">
    <div class="dropdown-menu">
        // items
    </div>
</div>

我向 dropdown-menu-container 添加了边框，并向 dropdown-menu 类添加了 overflow-y: auto 属性。

这解决了我的问题。希望这可以帮助。