twitter-bootstrap 为什么在 Bootstrap 中输入后没有换行符
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17258222/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why No Line Break After Input In Bootstrap
提问by Sajan Parikh
Here is the code that I'm using for a simple form. I pretty much copied the entire form from the example on Bootstrap's website, and removed all controls except a text input and the submit button.
这是我用于简单表单的代码。我几乎从 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>
For some reason, the submit button doesn't drop to a new line when it comes right after an input.
出于某种原因,提交按钮在输入后立即出现时不会降到新行。


You'll see, if I just add the checkbox w/ label back from the example, the submit button drops to a new line as expected.
你会看到,如果我只是从示例中添加带有标签的复选框,提交按钮会按预期下降到一个新行。
<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>


What am I doing wrong? I'm using the latest bootstrap CSS and JS (2.3.2), loaded from BootstrapCDN.com.
我究竟做错了什么?我正在使用从 BootstrapCDN.com 加载的最新引导 CSS 和 JS (2.3.2)。
回答by Artyom Neustroev
Both <input>and <button>have display: inline-block. <label>has display: blockand forces button to be rendered on the next line.
双方<input>并<button>有display: inline-block。<label>hasdisplay: block并强制按钮在下一行呈现。
The workaround for displaying button in the next line is simply wrap it in an element with display: block, i.e. in a <div>element.
Look at this FIDDLE DEMO
在下一行显示按钮的解决方法是简单地将它包装在一个带有 的元素中display: block,即在一个<div>元素中。
看看这个FIDDLE DEMO

