Twitter bootstrap 两个输入之间的引导图示符

我使用的是bootstrap3网格系统。我有以下两个输入字段，我想把glyphicon放在它们之间。不幸的是，当我为glyphicon本身分配整个列时，它不起作用。控制之间的差距太大

您能帮我在

flyFrom

和

flyTo

输入字段之间添加glyphicon吗。谢谢你的帮助

HTML:

            <div class="row">
                    <div class="col-md-2">
                            <input type="text" class="form-control input-md" id="flyFrom" placeholder="Country, city or airport">
                    </div>

                    <div class="col-md-1">
                        <span class="glyphicon glyphicon-resize-horizontal"></span>
                    </div>

                    <div class="col-md-3">
                        <input type="text" class="form-control input-md" id="flyTo" placeholder="Country, city or airport">
                    </div>

                    <div class="col-md-2">
                        <div class='input-group date' id='datetimepicker6'>
                            <input type='text' id="depart-date" class="form-control" />
                             <span class="input-group-addon">
                                 <span class="glyphicon glyphicon-calendar"></span>
                             </span>
                        </div>
                    </div>

                    <div class="col-md-2">
                        <div class='input-group date' id='datetimepicker7'>
                            <input type='text' id="return-date" class="form-control" />
                             <span class="input-group-addon">
                                 <span class="glyphicon glyphicon-calendar"></span>
                             </span>
                        </div>
                    </div>

                    <div class="col-md-1">
                        <div class='btn-group'>
                            <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="true">1 Adult<span class="caret"></span></a>
                            <ul class="dropdown-menu" role="menu">
                                <li><a href="#">Adults 12+ years</a></li>
                                <li><a href="#">Children under 12</a></li>
                                <li><a href="#">Children under 2</a></li>
                            </ul>
                        </div>
                    </div>

                    <div class="col-md-1">
                        <button type='button' class="btn btn-info">Search</button>
                    </div>
                </div>
            </div>

搜寻

小提琴：

---

试试这个？

您可以在第一个输入控件中放置一个内联图标，如下所示：

<div class="input-group ">
     <input type='text' id="return-date" class="form-control input-md" >
         <span class="input-group-addon">
             <i class="fa fa-calendar"></i>
         </span>

---

很抱歉，我一开始没听懂你的问题！！我的错

在此示例中，图标应位于两个输入之间：

<div class="input-group input-large">
        <input class="form-control" type="text" name="from">
        <span class="input-group-addon"> <i class="fa fa-calendar"></i>  </span>
        <input class="form-control" type="text" name="to">
    </div>

我希望这对你有帮助

---

另请参阅此提琴：

我的想法是希望控件之间的glyphicon不在第一个控件中…）图标是否正常工作？如果没有，则可能错误地附加了引导文件。如果是，你能在你的屏幕上发布一张它看起来像什么的图片吗？我只有6个声誉分数，需要10才能添加图像。是的，最好不要为图标分配单独的列，最好在一个引导列中放置两个带有图标的输入字段。这是一个很好的解决方案，谢谢。：）我很乐意。很高兴这有帮助。

<div class="input-group input-large">
        <input class="form-control" type="text" name="from">
        <span class="input-group-addon"> <i class="fa fa-calendar"></i>  </span>
        <input class="form-control" type="text" name="to">
    </div>