html - 当子 div 溢出时将子 div 文本包装在父 div 中

Question

代码笔:http://codepen.io/anon/pen/qaVRqw

我试图让 innerDiv 在文本超出父 div 之前换行文本。让所有文本都显示在 innerDiv 中但又被换行的最佳方式是什么？

我试过使用以下内容，但它们并不是我想要的:

overflow-wrap: normal;
overflow-wrap: break-word;

我不知道如何用谷歌搜索这个问题。我猜我应该添加某种负填充或边距？

我弄乱了 innerDiv 的宽度，但是当我改变位置时它会超出父级，除非我溢出，但随后内容就消失了。

编辑:更改了标题，因为我记住了我没有提交的最后一个问题

Answer 1

很多复杂的答案，但实际上是左边的 150px 导致它爆发，所以用右边的边距取消它......

#innerDiv {
    position: relative;
    left: 150px;
    margin-right: 150px; /* add this */
    background: pink;
}