将div大小调整为列表中最长的

Question

我在角度使用材质列表，每个列表项由三个字段组成：

• 商品名称（随机尺寸）
• datepicker（固定尺寸​​）

• 备注（弯曲以填充 div的其余部分）

  <md-list>
    <md-list-item class="md-3-line" ng-repeat="company in companies" ng-click="null">
       <div class="md-list-item-text" layout="column">
          <div layout="row" layout-align="space-between center">
             <h3>{{ company.general_name }}</h3>
             <md-datepicker ng-model="whater" ng-change="patch()">
             </md-datepicker>
             <md-input-container flex>
                <label>Coms</label>
                <textarea ng-model="whatever"></textarea>
             </md-input-container>
          </div>
       </div>
    </md-list-item>
  </md-list>
  

  我希望第二个字段（datepicker）每次都在最长名称确定的同一个地方开始。我想要的是将日期选择器排成一条直线，以便它看起来更清洁＆＃34;。

这是codepen以及我想要实现的目标

我发现这样做的更简单方法是使用固定大小的名称，如果有溢出，使用text-elipsis，但我不真的想要使用这个解决方案，除非我找不到更好的方法。