Question

标签文字下面有两行。

如何在不改变bootstrap列的情况下在一行中创建标签，如下所示。

labels.html

<div class="form-group col-md-6 fieldHeight">
    <label for="erh" class="col-md-5 required">Enterprise Reporting Hierarchy:</label>
    <div id="multiDropDownDiverh" class="dropdown col-md-7">
        <input type="text" class="form-control" id="erh" ng-model="nonPersistentProcess.erhKey">
    </div>
</div>

Answer 1

Bootply ：http://www.bootply.com/Pf86x2BEhn

HTML ：

// SCSS
@mixin cover {
  $color: red;
  @for $i from 1 through 5 {
    &.bg-cover#{$i} { background-color: adjust-hue($color, 15deg * $i) }
  }
}
.wrapper { @include cover }


// SASS
=cover
  $color: red
  @for $i from 1 through 5
    &.bg-cover#{$i}
      background-color: adjust-hue($color, 15deg * $i)
.wrapper
  +cover

只需添加此Css ：

<div class="form-group col-md-6 fieldHeight">
    <label for="erh" class="no-space-break col-md-5 required">Enterprise Reporting Hierarchy:</label>
    <div id="multiDropDownDiverh" class="dropdown col-md-7">
        <input type="text" class="form-control" id="erh" ng-model="nonPersistentProcess.erhKey">
    </div>
</div>

省略号的另一个例子： http://www.bootply.com/VRTxn5yiGH

Css ：

.no-space-break{
    white-space:nowrap;
  }

如何使用bootstrap列在标签内的一行中创建文本？

1 个答案: