Chrome 中 HTML 元素 <select> / <option> 的间距错误

Question

我用

创建了一个下拉菜单

.some_class {
  border: 1px solid #7f9db9;
}

<select id="some_id" class="some_class" size="1">
  <option selected="selected" value="1">User1</option>
  <option value="2">User2</option>
  <option value="3">User3</option>
</select>

并且在大多数情况下都运行良好。问题是，使用 Chrome 时，有时下拉列表中列出的元素之间会出现巨大的空白。看起来有些东西增加了元素之间的线距离或类似的东西。奇怪的是，如果我在不同的用户/不同的计算机上测试它，这个错误不会出现在每个 chrome 中。有没有可能是浏览器的设置导致了这个问题？

Answer 1

额外的间距是"feature"在Chrome59中引入的。如果它认为你有触摸设备，它会使选项更高。目前禁用此功能的唯一方法是禁用所有触摸设备。

https://bugs.chromium.org/p/chromium/issues/detail?id=739196&q=dropdown&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified

Chrome 中 HTML 元素 <select> / <option> 的间距错误

Spacing Bug with HTML Element <select> / <option> in Chrome

html

css

google-chrome

spacing

dropdown