2017-10-13 131 views
0

我上一个ASP.Net MVC项目上工作,其中我使用一些自举类添加的搜索文本框: 宽度在不工作输入搜索

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="row"> 
 
    <div class="col-lg-3"></div> 
 
    <div class="col-lg-6"> 
 
     <form method="g" action="@Url.Action("Index")"> 
 
      <div class="input-group"> 
 
       <input type="search" 
 
         name="searchTerm" 
 
         class="form-control" 
 
         placeholder="Search for..." 
 
         style="width: 100%;" /> 
 
       <span class="input-group-btn"> 
 
        <input type="submit" value="Search" class="btn btn-default" /> 
 
       </span> 
 
      </div> 
 
     </form> 
 
    </div> 
 
    <div class="col-lg-3"> 
 
    </div> 
 
</div>
上面的代码产生以下结果:

enter image description here

正如您所看到的,搜索文本框和搜索按钮之间有一个空格。我试图使用内联样式=“宽度:100%;”使输入搜索的宽度覆盖所有长度并使文本框和搜索按钮彼此关闭。

是我在上面的代码中缺少的东西?

+0

正常工作在这里http://jsfiddle.net/lotusgodkk/GCu2D/2170/。你有没有其他可能影响搜索的CSS? –

+0

在JSFiddle中没有repro:https://jsfiddle.net/t36b81p7/。你有使用其他CSS覆盖'btn btn-default'或'form-control'类吗? –

+0

这对我很好! – Ehsan

回答

-1

请删除style="width: 100%;" />。因为引导已自动调整宽度

+0

这永远不会导致他提到的问题 –