如何在使用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>