如何解决Firefox中含浮动子元素容器的overflow-wrap: break-word兼容问题

当带有overflow-wrap: break-word的文本与float元素并排时，Chrome 114可正常渲染：长单词'Antiestablishmentarianism'因无法适配剩余空间自动换行，能适配的单词保持完整；但Firefox 114未按预期处理，它没有考虑浮动元素的宽度，长单词被挤到浮动元素下方，仅最后一个字母'm'单独换行。

现询问：能否在不移除float元素、不修改现有结构的前提下，让Firefox实现与Chrome一致的换行效果？（已知可通过添加HTML包裹层使用flex等方案，但希望保留当前结构）

补充：不想使用break-all，因其会不必要拆分更多单词；但Firefox中使用word-break: break-all;时会考虑浮动元素宽度，不过会导致'indeed'这类短单词也被拆分，不符合需求。

可以通过给文本容器添加display: flow-root属性解决这个问题，无需修改结构或移除浮动元素：

.text-container {
  overflow-wrap: break-word;
  display: flow-root;
}

display: flow-root会创建新的块级格式化上下文（BFC），让Firefox正确计算浮动元素占据的空间，从而让长单词在剩余宽度内自动换行，同时不会像break-all那样拆分短单词，完美匹配Chrome的渲染效果。

如果担心兼容性（Firefox 53+已支持flow-root），也可以用overflow: hidden触发BFC，但display: flow-root是更专门的创建BFC的方式，不会带来额外的溢出隐藏副作用，更适合这个场景。

内容的提问来源于stack exchange，提问作者Drkawashima