Html 在内联或内联块元素上使用css省略号

我有2个内联元素，它们由div（block）元素包装

div宽度是固定的，2个子内联元素内容长度是可变的

我想要第二个子元素的省略号，它取决于第一个子元素的长度

Ex）

所以它看起来像是包装上的省略号，如果包装的内容比包装的长，我想省略号包装的子内容

---

如何执行此操作？

使用

文本溢出：省略号

：

.wrapper{
宽度：300px；
文本溢出：省略号；
空白：nowrap；
溢出：隐藏；
}
.左，.右{
显示：内联；
}

这应该全部显示
此内容应省略
Short+
此内容应省略
取决于左侧尺寸+
此内容应省略

您可以添加您的CSS代码吗？我可能会想出来，但我需要知道你的风格。你的意思是什么？谢谢，问题是其中一个子元素不是内联元素，而是h4，它是块元素；P

<div class="wrapper">
    <p class="left">This should be displayed all + </p>
    <p class="right">This content should be ellipsised </p>
<div>

<div class="wrapper">
    <p class="left">Short + </p>
    <p class="right">This content should be ellipsised </p>
<div>

<div class="wrapper">
    <p class="left">depends on left size + </p>
    <p class="right">This content should be ellipsised </p>
<div>

This should be displayed all + This content ...
Short + This content should be ellipsised
depends on left size + This content should ...