问题:
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