带有选择作为附加组件的 Bootstrap 输入组

Question

无论我尝试什么，我都无法获得带有选择框作为插件的输入。

这是我想要的：

但是，我似乎无法按照输入组的 Bootstrap 指南使其工作：

<div class="input-group">
    <input type="text" class="form-control"/>
    <select class="form-control input-group-addon">
        <option>Item 1</option>
        <option>Item 2</option>
    </select>
</div>

jsfiddle 演示

有人可以帮我吗？我已经找了一段时间了！

Answer 1

您可以通过向选择添加自定义样式来进行更改。

我向名为“select-group”的“input-group”添加了一个类，并以输入字段为目标并选择。

HTML

<div class="input-group select-group">
    <input type="text" class="form-control"/>
        <select class="form-control input-group-addon">
            <option>Item 1</option>
            <option>Item 2</option>
        </select>

</div>

CSS

.select-group input.form-control{ width: 65%}
.select-group select.input-group-addon { width: 35%; }

演示在这里