html - 防止按钮宽度更改 Basic CSS

Question

这里是基本的 CSS 问题。

每次我按下“全部选中”时，按钮都会填充列表中的名称(这很好)。

问题是:按钮宽度本身会扩展并变大。我想保持它的固定。此外，如何限制它可以显示的列表项的数量？因此，例如，如果有很多元素，在“测试 5”之后，应该出现一个“...”。

顺便说一句:这一切都在我的 custom.css 中，.btn-default 实际上来自 Bootstrap ，但我想在我的多选类中更改一些东西。我更改了插入符边距，因为插入符就在文本旁边，我希望它非常正确，也许这就是把一切搞砸的原因？？

自定义.css:

    .sv-manage-multiselect-dropdown {

        .btn-default {
            background-image: none;
            border: 1px solid #ADA9A9;
            padding: 6px 8px 1px 8px ;
            }

        .btn .caret {
            margin-left: 160px;
            margin-bottom:5px;
        }
    }  

HTML:

<td class="col-xs-2">
    <am-multiselect class="sv-manage-multiselect-dropdown"    
                    ng-model="Mylist.names"
                    options="Names.name for link in Mylist"
                    multiple="true"    
                    ms-selected="{{Mylist.names}}"                        
     </am-multiselect>        

</td>

之前:

之后:

Answer 1

您是否尝试过在您的 CSS 中使用最大宽度？

max-width: 40px;

例如。

希望这对您有所帮助!