Question

我需要帮助才能让我的搜索按钮靠近我的文本框，它似乎位于文本框下方程序：

<div class="search-full text-right">
    <a class="pull-right search-close"><i class=" fa fa-times-circle"></i></a>
    <div class="searchInputBox pull-right">
        <input type="search"
               data-searchurl="search?="
               name="q"
               placeholder="start typing and hit enter to search"
               class="search-input">
        <button class="btn-nobg search-btn" type="submit">
            <i class="fa fa-search"> </i>
        </button>
    </div>
</div>

Answer 1

根据Bootstrap标准，使用输入组是最好的选择。

请参阅：http://getbootstrap.com/components/#input-groups-buttons

Bootply Example using some of your code

<强> HTML：

<div class="row">
 <div class="col-lg-6">
  <div class="input-group">
   <input type="search"
           data-searchurl="search?="
           name="q"
           placeholder="start typing and hit enter to search"
           class="search-input form-control">
   <span class="input-group-btn">
    <button class="btn search-btn" type="submit">
        <i class="glyphicon glyphicon-search"> </i>
    </button>
   </span>
  </div><!-- /input-group -->
 </div><!-- /.col-lg-6 -->
</div>

编辑：我还为你创建了一个带有“清除”按钮的Bootply分叉，虽然它有点被黑了。见Bootply

将我的按钮放在文本框附近的html文档中

1 个答案: