javascript - HtmlService - 在选择元素中抑制 Firefox 箭头

Question

编辑:这个问题已经不同于被投票重复的问题，How to remove the arrow from a select element in Firefox .这个问题从一开始就在问题中被引用 - 在尝试获得每日接近投票的限制之前，请阅读问题。

---

我正在使用 Google Apps 脚本的 HtmlService 来显示 HTML 表单，包括 jQuery 和 javascript。使用推荐的 Google Doc 插件样式表，这是选择框在 Chrome 中的显示方式:

在 Firefox 中也是如此。注意额外叠加的箭头。

我怎样才能去掉 Firefox 中的覆盖层？

我已经尝试了 How to remove the arrow from a select element in Firefox 中描述的技术，但接受的和投票最高的答案在较新版本的 FF 中停止工作，并且对我不起作用。涉及溢出选择和用封闭的 div overflow hidden 的其他解决方案很有趣，但由于它们也消除了所需的“向上/向下”箭头，因此它们不适用于此应用程序。

HTML

<div class="block form-group">
  <label for="my-selection">Select an option:</label>
  <select class="width-100" id="my-selection">
    <option value="Option 1"></option>
    <option value="Option 2"></option>
    <option value="Option 3"></option>
  </select>
</div>

CSS

<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css">
<!-- The CSS package above applies Google styling to buttons and other elements. -->
<style>
.width-100 {
  width: 100%;
}
select {
  height: 31px;
}
</style>

Answer 1

我在 Firefox v37.0.1 中尝试了您的代码，它看起来与 Chrome 和 Safari 完全一样(没有额外的箭头)。也许谷歌更新了他们的 css 文件？