响应调整未知宽度

Question

我正在一个博客上工作，该博客上有大量文本，其中散布的图像浮动到右侧。在最大化的浏览器中，这看起来很好;然而，在较小的屏幕/窗口上，文本倾向于被图像压扁。当发生这种情况时，我想阻止文本在图像的任何一侧运行，例如在图片上设置float: none。

CMS使用<br><br>代替<p>...</p>，因此我们无法在文本上轻松设置min-width。它看起来像这样：

<article class="content">
    Text

    <div class="float-right">
        <img>
    </div>

    Text
<article>

.float-right可以是任何宽度，在某些情况下，可以在用户与页面交互时更改宽度。

是否可以防止文本被压扁＆＃34;只用CSS？如果没有，我可能会考虑修改CMS生成HTML的方式;我不想使用JavaScript。