html - 输入搜索中的宽度不起作用

标签 html css asp.net twitter-bootstrap twitter-bootstrap-3

我正在开发一个 ASP.Net MVC 元素,我在其中使用一些 Bootstrap 类添加了一个搜索文本框:

<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

如您所见,搜索文本框和“搜索”按钮之间有一个空格。我尝试使用内联style="width: 100%;"让输入搜索的宽度覆盖所有长度,并让文本框和搜索按钮彼此关闭。

我在上面的代码中遗漏了什么吗?

最佳答案

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

关于html - 输入搜索中的宽度不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46722638/

相关文章:

html - 在 UL LI 中垂直对齐?

asp.net - 在 asp.net GridView 中实现 javascript 排序

javascript - 如何访问 knockout 组件模板中的 View 模型变量?

image - 如何使用渐变贴图为 Canvas 中的图像调整 HTML5 Canvas 的色调。

javascript - 在 mousemove 上的 div 问题后圈出

html - 如何使此页面响应

c# - 如何在 C# 上制作的 javascript 上循环数组?

asp.net - 在 ASP.NET 中格式化标记文件

html - 使 DIV 中的无序列表居中,同时保持最后一行 LI 向左调整

html - 如何将 css 图片库放置在背景图片之上