在select元素上设置背景颜色时，Opera会在下拉列表中隐藏文本

Question

设置select元素的背景颜色时，Windows 7上的Opera 11.11会隐藏部分文本。这在其他浏览器中不会发生。

在设置背景颜色之前：

设置背景颜色后

这两个下拉列表之间的唯一区别是以下CSS：

 background-color: #fff;

HTML如下：

<select size="1">
  <option>Foo</option>
  <option>Bar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
  <option>Foobar foobar foobar foobar</option>
</select>

Here's a page，其中包含HTML和屏幕截图。

我无法想象为什么Opera应该像这样行事。我的HTML和CSS有什么问题，或者有解决方法吗？

更新

• 据报道，这在MacOSx Opera 11.11上正确显示。
• 向Opera报告错误DSK-337814。

Answer 1

我认为这个问题没有一般的解决方法。设置背景色时，Opera不再使用OS的渲染选择方式。您可能无法在Windows上看到这一点，但Debian上的两个选项之间存在巨大差异：

为每个选择元素添加背景颜色将使您的选择行为一致。这可能不是你所期待的，但恕我直言，这比有两种不同的行为更好。

正如乔丹已经提到的，使用形式化也是非常好的解决方案。

Answer 2

我不确定你是否能够在给定主题的情况下看到这个，但是在select元素上设置任何样式都会删除Opera对该元素的所有默认样式。在我的屏幕上你可以看出，因为选择背景颜色的样式看起来很不一样。

这似乎是Opera选择的默认样式中的一个错误。

围绕此方法的两种方法包括向选择添加填充权限，或者可能使用formalize等表单一致性库。