How To Enclose A Table In A Div

I have a div contained a table with two rows. Everything is fine if there is space between words, But If I put a long word (like 400 characters) in the , the table will g

Solution 1:

You're probably looking for the word-break CSS property, which is used to specify whether to break lines within words:

td {
   word-wrap: break-word;
   word-break: break-all;
}

Demo

Support for word-break is pretty good. See the MDN article for more information.

Solution 2:

With table-layout: fixed you need to set table width also:

#container {
    width: 70%;
    border: 1px solid;
    margin: 0 auto;
}
table {
    width: 100%;
    table-layout: fixed;
}
td {
    word-wrap: break-word
}

<div id="container">
    <table>
        <tr>
            <td>title</td>
            <td class="cc">contentttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt</td>
        </tr>
    </table>
</div>