html - 文本在 Bootstrap 中移出列

Question

我想让文本移到下一行，以便将其保留在自己的列中，但我的文本溢出了。我希望所有 1 都留在第一列。关于我可能需要更改/添加的内容的任何提示？

代码如下:

<div class="container-fluid ">
 <div class="row">
 <div class="col-sm-4"> Col1  1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</div>
  <div class="col-sm-4">Col2</div>
  <div class="col-sm-4">Col3</div>
</div>
</div>

这是其外观的链接:JSFiddle

Answer 1

.col-sm-4 {
   -moz-hyphens:auto;
   -ms-hyphens:auto;
   -webkit-hyphens:auto;
   hyphens:auto;
   word-wrap:break-word;
}

这应该可以完成工作。你的问题是，浏览器无法决定在哪里休息，因为你没有一个空间。使用连字符，当没有足够的空间时，你会强制他跳到下一行。在此处查看浏览器支持:https://developer.mozilla.org/de/docs/Web/CSS/hyphens#Browser_compatibility