Question

我正在尝试将搜索按钮附加到输入搜索字段，该字段无法正常工作。

我无法追踪错误，因为我不熟悉bootstrap。

上设置了一个示例

我试图让它在基于asp.net webform的网站上运行

以下是代码段

        <div id="search-wrapper" class="span3 offset5">
            <div  class="span3 input-append">
                <asp:TextBox ID="txtSearch"  placeholder="Search" runat="server"></asp:TextBox>
                <asp:Button ID="btnSearch" CssClass="btn" runat="server" Text="Go!" />
            </div>
        </div>

Go按钮未与输入字段正确附加。如example

所示

我对css进行了一些小改动，使其适用于max-width：1000px。

休息几乎相同。我甚至尝试直接从CDN使用botstrap css，但它与按钮没有区别

更新：

我尝试更改.btn css

.btn {
  display: inline-block;
  *border-left: 0 none #e6e6e6;
    border-right: 0 none #e6e6e6;
    border-top: 0 none #e6e6e6;
    border-bottom: 0 none #b3b3b3;
    display: inline;
    padding: 4px 12px;

此行填充：6px 12px;。这个问题在FF中得到了很好的修复，但是其他浏览器使问题变得更糟。

Answer 1

在这里工作，设计有点糟糕：http://jsfiddle.net/azF8w/54/

<div class="input-prepend">
    <span class="add-on"><button>Go</button></span>
  <input class="span2" id="prependedInput" type="text" placeholder="Username">
</div>

响应式设计，引导程序无法正常工作

1 个答案: