具有固定宽度和滚动条的 HTML 选择元素

Question

这可能是一个基本的 CSS 问题，但我的 CSS 并不流利，而且似乎只是在兜圈子。

这是我的英语:我有一个 400 像素的固定宽度选择元素。每个选项的文本都不适合 400 像素的宽度。我没有得到水平滚动条，它只是切断了文本。如何获取滚动条？

这是我在 HTML/CSS 中的内容:

<div>
  <select style="width=400px">
    <option>this text is too wide to fit and gets cut off.....</option>
    ...
  </select>
</div>

我已经尝试过 overflow 属性，但要么我没有正确使用它，要么它对 select 元素不起作用。

如何获取水平滚动条？

Answer 1

众所周知，表单元素很难设计样式。

对于您的宽度设置，您有一个小错字。你需要

<select style="width: 400px">

否则，我认为使用普通的 select 元素无法实现水平滚动条。您将不得不求助于基于 JavaScript 的替代方案，例如 SexyCombo ，它可以定制为有一个滚动条。更多选项在这里:11 jQuery Plugins to Enhance HTML Dropdowns