将“input”和“select”语句组合在一行中

Question

当我想要第一个输入元素和一个select语句之后，我怎么能得到一个漂亮的视图.. 它现在看起来像这样：

<div class="form-group">
    <div class="input-group">
        <input class="form-control" type="text">
        <div class="input-group-addon">
            <select class="selectpicker form-control">
                <option value="test">Test</option>
            </select>
        </div>
    </div>
</div>

但我希望在此页面上显示以下元素：https://www.bootply.com/97519 但是使用select语句而不是ul ..

Answer 1

我想你想要这样：

＆＃13;

＆＃13;

.input-group-addon.select-input {
  width: 20%;
  padding: 0;
}

.input-group-addon.select-input select {
  border: none;
  height: 32px;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="form-group">
    <div class="input-group">
        <input class="form-control" type="text">
        <div class="input-group-addon select-input">
            <select class="selectpicker form-control">
                <option value="test">Test</option>
            </select>
        </div>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;