Bootstrap:内联帮助块

时间:2014-10-25 18:45:49

标签: twitter-bootstrap twitter-bootstrap-3

我希望帮助块与输入字段内联(如果输入字段右侧有可用空间),但无论屏幕有多宽,它都在输入字段下方。我该如何将其内联?

以下是表格:

  <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>

这是一个plunk

3 个答案:

答案 0 :(得分:5)

.help-block所做的其中一件事是设置display:block。如果您不想要,可以像这样覆盖它:

.help-block {
    display: inline;
}

Demo in Plunker

答案 1 :(得分:1)

class
   *.cpp   
project1
   jni
   obj
   build.sh
project2
   jni
   obj
   build.sh

答案 2 :(得分:1)

我知道一个旧问题,但对于遇到此问题的任何人,只需使用inline-block代替help-block作为您的班级。