无论父级如何，强制DIV包装文本

Question

所以我将div埋在固定的桌子里。我在word-wrap和td元素上有一些div和其他msic CSS。但是，当我到达我的孩子div时，我想忽略所有继承并包装我的文本而不会破坏这个词。

#row4 td > div, textarea{
    height: 100%;
    width: 100%;
    border: 1px solid #C8C8C8;
    overflow: auto;
    padding: 5px;
    border-radius: 5px;  
    white-space: pre; /* needed for Chrome to maintain tabs, spaces, etc */
}
#div_contents{
    display: inline-block;
    white-space: normal;
    word-wrap: normal;
}

<tr id="row4">
    <td>
        <div id="div_search_results" class="results" ></div>
    </td>
    <td>
        <div id="div_contents"></div>
        <textarea id="ta_contents"></textarea>
    </td>
</tr>

这会导致溢出条并且不会包装我的内容。但是，如果我使用word-wrap: break-word;，我会收到包装内容，但它会在单词中断开。

无论父母阻止，休息，包裹等等，我都不能覆盖我的孩子div以获取正常包装的文字吗？

以下是Chrome的CSS屏幕截图：

Answer 1

解决。最后，<pre>插件添加了highlight.js个标签。