Css 将Flexbox和文本省略号与中间容器一起使用

我需要在flexbox中的

h2

文本中添加文本省略号。 我发现了很多很好的例子，但没有一个适合我的情况，中间有中间div：

<div class="parent-flex">
   <div class="inner-div-1">
      <div class="inner-div-2">
         <h1>My long text is here</h1>
      </div>
   </div>
   <div>... other column...</div>
</div>

尝试添加：

min-width: 0;
display: flex;
flex: auto; // tried also 0, 1, 0 1 and lot of other combinations

到链中的每个DIV，但无法使其工作：(

任何帮助都将不胜感激！ 无法使其工作。

找到了解决方案：）

无需向内部div添加任何css

只是：

min-width: 0;
display: flex;
flex: auto; // tried also 0, 1, 0 1 and lot of other combinations

.parent-flex {
    flex: auto;
    flex-direction: column;
    padding: 0 20px;
    min-width: 0px;
}

h1 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}