Question

我有一个页面显示从mysql数据库中检索的文本。

我无法弄清楚为什么我无法将文本显示为div中的文本块。相反，它溢出了div。（我使用bootstrap 3）这是一个fiddle

＆＃13;

RadioButton

＆＃13;

Answer 1

使用word-break:break-all;打破单词

.mytext{
  word-break:break-all;
}

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row">
    <!---MAIN COLUMN------>
    <div class="col-xs-12 col-md-6 col-sm-8 col-lg-6 col-centered">
      <h2>
        How to keep the text inside the div?
      </h2>

      <div class="mytext">
        fdsnkfhskghkgskghsdkghdskghdsklhgkdlsghds
        khgkdshgdksghdsklghdskg hkdslhgkdshgkdshgkdshgkd
        shgksdlhgksdhgkdslhgkdshgkdshgkdshgksd hgkldshgkd
        shgkldshgkhdsgkhdskghdskhgkdlshgkdshgkldsh
        gkdshgklhds kghdskghdskl
        <small>
        </small>

      </div>

    </div>
  </div>
</div>

Answer 2

将CSS提供给

.mytext{
  width:200px;
  word-wrap:break-word;
  border:thin black solid;
}

此处已更新JSFiddle

Answer 3

这是一个纯粹假设的问题 - 在一个真实的网站上，你将拥有真实的文字，其中包含比你的示例幻想字更短的真实单词，并且它们将很好地适应该div，因为文本将被打破单词结束，即空格。只需使用相同的真实文本，你就会看到。

如何将文本保留在div中？

3 个答案: