如何在使用Angular UI时防止文本溢出Bootstrap

Question

我正在使用Angular UI Bootstraps按钮组显示复选框。

我已经试过什么：

1. 我使用“白色空间” CSS声明试过，但它并没有帮助。

2. 我也试着从<label>改变各个按钮出两个<div> & <a>

这些都不解决溢出文本的问题。

如何轻松防止文本溢出？

的jsfiddle：

如果收缩右手列的宽度，虽然它可能不容易看到，由于结果显示中的位置，你会看到文本溢出。

注意：我不能（不希望）在按钮元素上设置特定的宽度或高度。

Answer 1

您可能需要更具体地使用您的CSS规则来覆盖.btn的空白属性。

label.btn { 
    white-space: normal; 
} 

或者你可以在你的按钮中添加另一个容器并给出这个空白属性。

<label class="btn btn-default"> 
    <span style="white-space: normal"> 
     <input type="checkbox"> 
     Connections/Hoses Leaking or Cracked Connections/Hoses Leaking or Cracked 
    </span> 
</label>