让容器在换行时缩小

Question

是否可以使用CSS将带有文本的容器缩小为箭头1在图片上显示？而不是在空间不适合单词。

word-break: break-all你可以通过让词语适应直到休息来消除那个空白空间，但这不是所希望的行为。

.container {
  border: 1px solid black;
  padding: 2px;
  display: flex;
}

.text {
  border: 1px solid red;
  margin-right: 2px;
}

.indicator {
  border: 1px solid blue;
}

.indicator:after {
  content: '\23F7';
}

<div class="container">
  <div class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit</div>
  <div class="indicator"></div>
</div>