选择与输入无关的下拉宽度

2024-04-08

我正在尝试使用 Selectize 呈现很长标签的下拉列表。文本可以很宽,但输入对宽度有限制。 Selectize 完美地包裹文本(在输入和下拉菜单中),但理想情况下,下拉菜单能够比输入更宽,以实现更好的可读性。是否可以让 Selectize 具有独立于输入的下拉宽度?

<select style="width:300px" multiple>
<option value="">Enter some tags...</option>
<option value="1" selected>QID7_4 : Where do you store your digital photos? Check all that apply.-On a cloud service like iCloud, Dropbox, Google Drive, or Amazon Cloud</option>
<option value="2">QID5_2 : What do you take pictures of most often? Please rank the following / by drag and drop.-Friends and social activities</option>
<option value="3">QID13_5 : How important is it to you that your photos are organized in the / following ways?-By quality (including favorites)</option>

目前的外观:

Desired look: enter image description here

这个想法是,如果下拉列表展开以减少换行,则文本的可读性会更高。

示例 jsFiddle https://jsfiddle.net/DmLdh/12/


每个标签的宽度是通过JS动态设置的。 要覆盖它如何做这样的事情:

.selectize-dropdown {
    width: 600px !important;
}

Fiddle https://jsfiddle.net/DmLdh/13/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

选择与输入无关的下拉宽度 的相关文章

随机推荐