html - パーセンテージ幅内のパーセンテージ幅 - 長い単語はテーブルのサイズを変更します

Question

次のコードがあるとします。

<table id="container" style="width: 100%">
        <tr>
        <td id="col1" style="width: 50%">
            <div class="someElement"></div>
            <div class="someElement"></div>
            <div class="someElement"></div>
        </td>
        <td id="col2">
            <div class="someElement"></div>
            <div class="someElement"></div>
            <div class="someElement"></div>
        </td>
    </tr>
</table>

someElement に「幅 95%」(それぞれ「col1」または「col2」) を設定したいと思います。問題は、 someElement に大量のテキストが含まれており、非常に長い単語がある場合、 someElement がテーブル全体の幅を変更することです。「word-wrap: break-word」プロパティを使用しています。コンテナーに固定幅を指定できることはわかっていますが、ユーザーの画面解像度に関係なく、コンテナーが常に幅の 95% を占めるようにしたいと考えています。

どうすればこれにアプローチできますか?