垂直对齐许多弹性项目的内部元素（必须能够换行）[重复]

Question

我在弹性容器中有大量可变数量的

.item

，它们必须能够响应式换行。每个

.item

具有相同的标记，但文本内容的数量不同。我希望所有

<h1>

的顶部垂直对齐，并且所有

<p>

的顶部也垂直对齐。

有没有一种方法可以在不重写标记或使用 javascript 的情况下实现此目的？

我知道这可以通过网格完成，并将 .items 设置为

display: contents; 

，但是

.item

不会换行。

代码示例：https://codepen.io/vzjrz/pen/KKrGOWq

目前布局：

所需布局：

Answer 1

将

margin-top: auto;

添加到 css 中的“p”标签