为什么在Bootstrap中输入后没有换行

Question

这是我用于简单表单的代码。我几乎从Bootstrap网站上的示例中复制了整个表单，并删除了除文本输入和提交按钮之外的所有控件。

<form>
    <fieldset>
        <legend>About You</legend>
        <input class="input-medium" type="text" placeholder="First Name">
        <button type="submit" class="btn">Get Started</button>
    </fieldset>
</form>

出于某种原因，提交按钮在输入后立即不会掉到新行。

你会看到，如果我只是从示例中添加带有标签的复选框，则提交按钮将按预期下降到新行。

<form>
    <fieldset>
        <legend>About You</legend>
        <input class="input-medium" type="text" placeholder="First Name">
        <label class="checkbox">
            <input type="checkbox"> Check me out
        </label>
        <button type="submit" class="btn">Get Started</button>
    </fieldset>
</form>

我做错了什么？我正在使用从BootstrapCDN.com加载的最新bootstrap CSS和JS（2.3.2）。

Answer 1

<input>和<button>都有display: inline-block。
<label>有display: block并强制按钮在下一行显示。

---

在下一行显示按钮的解决方法只是将其包含在display: block的元素中，即在<div>元素中。 看看这个FIDDLE DEMO