html - Bootstrap 输入附加不适用于流体网格

Question

我正在尝试将 input-append 用于流体行内的搜索输入，但不幸的是它似乎无法正常工作，因为它无法缩放到容器的全宽。

这是我的示例代码:

<div class="container">
<div class="row-fluid">
<div class="span12">


    <div class="input-append">
    <input class="span12" id="appendedInputButton" type="text">
    <button class="btn" type="button">Go!</button>
    </div>

</div>
</div>
</div>

但输入不会缩放 span12 的整个宽度。有谁知道为什么会这样或者我错过了什么？

Answer 1

这是一个 jsFiddle:http://jsfiddle.net/persianturtle/SXcV3/

#appendedInputButton {
    width:100%;
}

我还建议您将 span12 类用于保存输入的 div，而不是输入本身。

更新:由于 bootstrap 出于美观原因向按钮添加了一些填充，我将输入按钮的宽度设置为 95%，这样在没有水平滚动条的情况下看起来更好。

更新的 jsFiddle:http://jsfiddle.net/persianturtle/SXcV3/1/