Html 如何在CSS中创建一个后续按钮，将其自身限制为容器的长度？

我有以下HTML：

一些文本

其中“某些文本”部分可以是任何内容。我希望在CSS中实现以下目标：

---

我尝试使用绝对定位元素、浮动和其他一些技巧，但没有一个奏效。有人能帮我实现同样的目标吗？我甚至不知道CSS是否可以实现这一点，但我可能错了。

Flexbox可以轻松做到这一点：

.box{
显示器：flex；
最大宽度：200px；
边框：1px实心；
}
.盒子跨度：第一个孩子{
溢出：隐藏；
文本溢出：省略号；
空白：nowrap；
}
.box span：最后一个孩子{
弹性收缩：0；
左边距：5px；
}

一些文本


越来越多的文本


这里有大量的文字溢出

Flexbox可以轻松做到这一点：

.box{
显示器：flex；
最大宽度：200px；
边框：1px实心；
}
.盒子跨度：第一个孩子{
溢出：隐藏；
文本溢出：省略号；
空白：nowrap；
}
.box span：最后一个孩子{
弹性收缩：0；
左边距：5px；
}

一些文本


越来越多的文本


这里有大量的文字溢出

您的HTML是一成不变的，还是您愿意接受其他元素以产生所需结果？我愿意接受其他结构化HTML的方法。您的HTML是一成不变的，还是您愿意接受其他元素以产生所需结果？我愿意接受其他结构化HTML的方法。