html - <select> 下拉几个像素

Question

考虑 this Bootstrap bug report .基本上，<select>下拉菜单与 <select> 不对齐Chrome 和 Safari 上的元素(都只测试了 Mac)。 @mdo 认为没有解决办法。我只想要第二个意见。

可以<select>下拉菜单与底部对齐 <select>元素？

Answer 1

您永远不会在多个浏览器和多个操作系统中使用相同的浏览器内置工具样式。

我已经这样做了很长时间，我最好的建议是尽可能设计出最好的样式，并为旧的 IE 浏览器保留古怪的 css hack。

如果你想对精确像素进行 super 分析，你不需要使用 select html 标签，而是使用 ul 标签。然后用css来list-style: none;

<ul id="my_selectbox">
  <li>Option 1</li>
  <li>Option 2</li>
</ul>

然后，设置菜单的样式以使其看起来完全符合您的要求。

所以把它想象成一个菜单而不是一个选择框。

然后使用 javascript 使菜单像选择标签一样下拉。

(但对于几个像素肯定需要大量工作，不是吗？)

请记住，您永远不会编写使所有浏览器看起来都一样的 CSS 文件。只是它们不是这样设计的。如果您的经理有此要求，他们需要了解这些东西是如何工作的。

进一步注意:您还必须使用 javascript 来存储选择。如果您需要，我可以为您编写一个快速脚本来执行此操作。不确定您对 javascript 的熟练程度。