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值无效，无法使用数字{/ 1>启动id

Answer 2

您是否尝试将white-space: normal;添加到span class="break-wo"？这应该有所帮助。

Answer 3

试试这种方式......

<div class="radio">
 <label class="btn btn-info">
  <input type="radio" id="1" name="optionsRadios" class="hidden" value="option1" checked>
  Option one
 </label>
</div>

在标签内添加标签

自动换行不在bootstrap 3中工作

3 个答案: