Twitter Bootstrap：添加按钮时输入宽度会发生变化

Question

我有一个使用Bootstrap设计的输入框。当我从输入组中删除按钮时，输入框的宽度会发生变化。如何在不使用输入框的情况下获得全宽？

使用按钮

<div class="input-group input-group-sm">
    <input class="form-control" name="abc" placeholder="1" type="text">
    <span class="input-group-btn">
        <button type="button" class="btn btn-primary">Save</button>
    </span>
</div>

没有按钮

<div class="input-group input-group-sm">
    <input class="form-control" name="abc" placeholder="2" type="text">
</div>

添加按钮时输入框的宽度会发生变化

http://jsfiddle.net/hq5A8/2/

Answer 1

如果您不打算使用旁边的按钮，则它不是输入组。删除周围的<div class='input-group'>，你应该没问题。

没有按钮的新代码将是：

<input class="form-control" name="abc" placeholder="2" type="text">

如果你想要一个包装器，你应该在包装器div上使用类form-group。