Twitter Bootstrap 按鈕文本自動換行 - Twitter Bootstrap Button Text Word Wrap

問題:

For the life of me I am unable to get these twitter bootstrap buttons to text wrap onto multiple lines, they appearing like so.對於我的生活,我無法讓這些 twitter bootstrap 按鈕將文本換行到多行,它們看起來像這樣。

I cannot post images, so this is what it is doing...我不能發佈圖片,所以這就是它在做什麼......

[This is the bu] tton text [這是按鈕] tton 文本

I would like it to appear like我希望它看起來像

[This is the ] [這是]

[button text ] [按鈕文字]

<div class="col-lg-3"> <!-- FIRST COL -->
  <div class="panel panel-default">
    <div class="panel-body"> 
    <h4>Posted on</h4>
    <p>22nd September 2013</p>
    <h4>Tags</h4>
    <a href="#" class="btn btn-primary btn-xs col-lg-12" style="margin-bottom:4px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a>
   <a href="#" class="btn btn-primary btn-xs col-lg-12" style="margin-bottom:4px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a>
   <a href="#" class="btn btn-primary btn-xs col-lg-12" style="margin-bottom:4px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a>
           </div>
  </div>
</div>

Any help would be much appreciated.任何幫助將非常感激。

Edit.編輯。 I have tried adding word-wrap:break-word;我試過添加word-wrap:break-word; but it is not making any difference.但它沒有任何區別。

Edit.編輯。 JSFiddle http://jsfiddle.net/TTKtb/ - You will need it expand the right column so the panels sit next to one another. JSFiddle http://jsfiddle.net/TTKtb/ - 您將需要它展開右列,以便面板彼此相鄰。


解決方案:

參考一: https://en.stackoom.com/question/1HhmM
參考二: https://stackoom.com/question/1HhmM
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章