JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cont">
<div class="block word_break">блоки меню</div>
<div class="content word_break">ри таких условиях параметр в css word-wrap: break-word;word-break:break-all; - не переносит текст при переполнении,
казалось бы проблема простая, но не совсем, даже не смотря на то что у меня фиксированная ширина, я мог быть указать ширину явным образом 650px
и тогда текст в контенте будет переносится, но дело в том, что на некоторых страницах сайта, div с блоками будет исчезать и тогда контент должен будет заполнить всё пространство.

Или как-то через джей-квери  можно решить вопрос? я не очень силён в jq и не представляю как определить есть див с блоками или нету чтобы растягивать див с контентом на 100%,
или всё-таки как-то можно сделать перенос слов в диве с неизвестной шириной? </div>
</div>

CSS

.cont {
  float: left;
  position:relative;
    
}
.word_break {
    word-wrap: break-word;
    word-break: break-all;
}
.block {
    float left; width:200px;
    border:1px solid blue;
    position:relative;
    float: left;
}
.content {
    float left; width:auto;
    border:1px solid green;
    width:100px;
    position:relative;
    float: left;
}