【SCSS/CSS🔰】カード内テキストの行数がバラバラになる！高さを統一させる方法

ホームページ制作にあたり、自分自身が躓いたポイントをメモとして残しています。

現象

画像、タイトル、テキスト、ボタンなどの構成のカードで、
テキストの行数が片や１行、片や２行とバラバラな時、全体の高さもバラバラになってしまう。
ボタンの位置が上につまる。

対象方法

親要素をflexに設定し、子要素にflex１を指定することで解決

.parent {
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
}

.child {
flex: 1;
}