Question

我一直在研究div，我现在正在研究html / css部分以完成样式;之后我将在php部分上工作，从数据库中加载div内的文本;
div：

HTML：

<div class="descriereapostarii">
 wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww
</div>

在这里你可以看到我的问题，我的div就像上面的HTML代码块一样，我不希望那样（水平溢出）我希望div溢出垂直。
（在这里我有250个字符，这是因为当用户写入描述时，最大可接受限制为250）

CSS：

.descriereapostarii{
padding:1px;
float:left;
position:relative;
border:1px solid #00A800;
height:80px;
width:460px;
overflow:auto;}

问题：
当页面加载时我想在div内部内容相对于实际div的大小只滚动垂直，类似于当你将描述写入stackoverflow上的问题时这个帖子框，它只溢出垂直而不是水平，我我想用我的div，任何想法做同样的事情？

Answer 1

将此用于您的div：

word-wrap: break-word;

演示：

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-wrap

Answer 2

添加此css以禁用垂直滚动：

overflow-x: hidden;

Answer 3

如果您需要在单词中断行，请使用word-break: break-word;

注意：对于中文，日文和韩文文本，您可能需要word-break，因为word-wrap在某些情况下不起作用。

.descriereapostarii{
  padding:1px;
  float:left;
  position:relative;
  border:1px solid #00A800;
  height:80px;
  width:460px;
  overflow:auto;
  word-break: break-word;
}

<div class="descriereapostarii">
wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww
</div>

文本加载时垂直溢出

3 个答案: