我遇到一个问题，文本在选择菜单中悬停的 X“清除”按钮下重叠。在右侧添加填充并不是解决方案，因为它将图标推到框外。我正在使用此处找到的 Select2 JS 库 https://select2.org/ 和 Bootstrap 5
2
1132$("#search_bar").select2({
theme: 'bootstrap-5',
placeholder: "Some text",
allowClear: true
});
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
添加以下 CSS。
.select2-selection__clear { position: absolute !important; right: 2px !important; }https://jsfiddle.net/8n23bd6q/
按照此处的文档操作 Select2 文档。您可以使用
width: 'style'和标签<select>中的内联样式来扩展 select2 宽度。这里我将select的宽度设置为200px然后，通过查看 select2 的 DOM 结构（使用 Chrome Devtool），我发现我们可以通过添加以下 CSS 来使 X 按钮不与文本重叠：
.select2-selection.select2-selection--single { padding-right: 50px !important; }