包含在选择框中 - Firefox的问题

Question

我有一个bootstrap选择框，其选项对于select容器的宽度来说太大了。选择已被覆盖并相应地设置样式。我已经（或者想要）将选项文本包装在选择框中。它看起来不错，但是它没有包装。看看http://bootply.com/83141

我的工作就是改变：文本溢出：'';到“省略号”。省略号仍然包含在chrome中，但通过添加...

在FF中更加用户友好

有没有人有任何替代方案或让FF像铬一样变形？

            <div class="span4">
                <div class="styled-select caret-select">
                    <select name="tickets" id="tickets" onchange="setContractValue();">
                        <option>this is a long option that needs to wrap in the box</option>
                    </select>
                </div>
            </div>

Answer 1

您可以尝试使用fieldset模拟选择标记。见https://mdn.mozillademos.org/files/4563/editable_select.html

那或你可以制作两个选项标签。一个是第一个，另一个是第一个的延续。他们都选择相同的值。

否则看起来你必须用javascript做点什么。

Answer 2

根据研究，截至2020年似乎还没有解决方案，您发现的在Firefox中添加省略号的变通办法是我发现的最好的方法。