带有组合框的引导导航栏搜索字段（或任何下拉列表）

Question

我正在使用Bootstrap v2.0.2。以下是我为我的网站建立的导航栏

搜索由三个字段组成

1) Combo box or any drop down 
2) search input text field 
3) Search icon ( click-able ) 

。 这是上面屏幕截图的小提琴（请在firefox中打开）

http://jsfiddle.net/krg78/1/

有没有什么方法可以让组合框看起来像文本输入的一部分（现在两个看起来不同的字段），而不是Search2显示搜索图标，可以点击（如在Facebook）？

如果我使用下面的行，我只是用空白字段代替图标。

<span class='add-on' style="float: right"> <i class="icon-search"></i> </span> 

谢谢大家

Answer 1

检查http://jsfiddle.net/krg78/2/

你可以通过添加相对于组合框的位置并将其移动到输入中来使组合框看起来像文本输入的一部分：

.navbar-search select {
  position: relative;
  left: 84px;
}

.navbar-search input {
  padding-left: 84px;
}