twitter-bootstrap Bootstrap:使帮助块内联
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26565934/
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
Bootstrap: Make help-block inline
提问by EricC
I want the help-block to be inline with the input-field (if there is space available to the right of the input-field), but it is below the input-field no matter how wide the screen is. How can I make it inline?
我希望帮助块与输入字段内联(如果输入字段右侧有可用空间),但无论屏幕有多宽,它都在输入字段下方。我怎样才能使它内联?
Here is the form:
这是表格:
<form class="form-inline" role="form">
<div class="form-group">
<label for="query">Search</label>
<input type="text"
ng-model="query"
class="form-control"
id="query"
placeholder="Enter search text">
<span class="help-block">
Search in any field...
</span>
</div>
</form>
And here is a plunk.
这是一个plunk。
采纳答案by KyleMit
One of the things .help-blockdoes is set display:block. If you don't want that, you can override it like this:
其中一件事.help-block就是 set display:block。如果你不想那样,你可以像这样覆盖它:
.help-block {
display: inline;
}
Demo in Plunker
在 Plunker 中演示
回答by Carlos Liu
/* Make the help displayed horizontally and set with same color with help-block */
.help-inline {
display: inline;
color: #737373;
}
回答by Tom Harris
I know an old question, but for anyone coming across this, just use inline-blockinstead of help-blockas your class.
我知道一个老问题,但是对于遇到此问题的任何人,只需使用inline-block而不是help-block作为您的课程。

