Question

我已成功为vanilla Bootstrap，selectize等创建了css文件。但现在我正在努力修改Bootstrap-select的默认css。具体来说，我正在尝试

删除元素的边框
更改元素的宽度，使其适合具有给定宽度的列

至于现在，由于某种原因，第二列与第一列重叠。如果删除th.zeon-fixed-narrow-column {width: 1.5em;}，则此错误消失。我认为我不想删除它，我想要第一列与1.5em一样窄！

这是我的jsFiddle

＆＃13;

table {
    table-layout: fixed;
}

th.zeon-fixed-narrow-column {
	width: 1.5em;
}

.zeon-selectpicker{
   border:none !important;
   width: 1.5em;
}

.zeon-selectpicker:focus{
    background-color:red;
}

＆＃13;

table {
    table-layout: fixed;
}

th.zeon-fixed-narrow-column {
	width: 1.5em;
}

.zeon-selectpicker{
   border:none !important;
   width: 1.5em;
}

.zeon-selectpicker:focus{
    background-color:red;
}

＆＃13;

Answer 1

如果我理解正确的话。您希望下拉列表的宽度等于您的表格标题吗？

要实现此目的，请将此添加到您的css：

.bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn){
  width:100%;
}

默认情况下，上面的bootstrap-select类的固定宽度为220px。您可以在此处查看结果：JSFIDDLE。

如果这不是您想要的，请告诉我，我会尽力帮助您

更改bootstrap-select元素宽度和删除边框

1 个答案: