html - 自动换行在 bootstrap 3 中不起作用

Question

我正在尝试创建一个上面有一些文本的按钮。但是文本没有环绕在按钮上。这是我所做的。

<div class="form-group">
  <div class="col-md-6 col-sm-6 col-xs-6">
    <input type="radio" id="1" class="hidden">
    <label for="1" class="btn btn-info btn-preference  pull-right">Stability</label> 
  </div>
  <div class="col-md-6 col-sm-6 col-xs-6">
    <input type="radio" id="1" class="hidden">
    <label for="1" class="btn btn-primary btn-preference text-center">
      <span class="break-wo">Freedom and Risk</span>                                                        
    </label> 
  </div>
</div>

这是 Link for bootfly

Answer 1

这不是换行，它是 white-space: nowrap; 防止文本在使用 .btn 时换行，其中包含 white-space: nowrap ; 所以使用 white-space: normal;

label[for="1"].btn {
    white-space: normal;
}

Demo

---

注意:您的ID 值无效，id 不能以数字开头