HTML-CSS：如何从最后一个单词开始对齐文本？

我有一个很有挑战性的设计要做。 有人遇到过这种情况吗

这是我需要的设计，文本是底部对齐的，但是如果行上没有足够的空间，文本会向上流动

-------------------


this is 
a pretty long title
-------------------

这里不是我需要的，通过

垂直对齐：底部

或

位置：绝对可以轻松实现；底部：0

，但文本流并不是我想要的

-------------------


this is a pretty long
title
-------------------

请注意，第二行的单词比第一行多。换行过程是，如果文本太长，无法换行，请将第一个单词换行到上面的一行

---

任何帮助都将不胜感激。

尝试将其放入固定的

div.not\u固定{
边框顶部：1px虚线；
边框底部：1px虚线；
显示器：flex；
}
分区固定{
宽度：100px；
高度：100px；
边框顶部：1px虚线；
边框底部：1px虚线；
显示器：flex；
}
.固定跨度{
自对准：柔性端；
}

这是一个相当长的标题


这是一个相当长的标题

这真是一团糟。但它确实能满足你的需求。我不认为有什么好方法可以让你表现出你想要的行为。祝你好运

window.onload=函数（）{
var peaches=document.getElementsByClassName（“peaches”）；
对于（var i=0；i=0；i--）{
结果+=“”+文本[i]+“”；
}
element.innerHTML=结果；
}
函数对齐跨度（节点、框）{
var-previousY=null，previousRight=null；
对于（var i=nodes.length-1；i>=0；i--）{
var style=nodes[i].style；
style.position=“relative”；
var rect=nodes[i].getBoundingClientRect（）；
if（previousY！=null&&rect.y==previousY）{
style.right=先前的right；
}否则{
style.right=rect.x-box.x；
previousY=rect.y；
previousRight=style.right；
}
}
}

p.peaches{
宽度：125px；
显示器：flex；
柔性包装：反向包装；
方向：rtl；
证明内容：柔性端；
}

这是一个相当长的标题

谢谢您的快速回复，但这并不是我想要的。请注意，在我的示例中，第二行的单词比第一行多。我需要反转文本换行。如果不手动设置断点，则无法使用纯HTM/CSS执行所需操作。浏览器在最后一个可能的点中断。如果文本超过3行或更多行，您的设计将如何工作？谢谢！这很有效。我会接受这个答案，尽管我仍然期待更优雅的答案。我也不太喜欢碰多姆。