他のものに影響を与えずにフレックスボックスの下の "行"をどのように整列させるのですか？

Question

私は問題があります。私はflexboxで実装したテーブルを持っています。私は他の行の間隔に影響を与えずに、下の "行"を揃えたい。 （技術的には、行ではありませんので、私は引用符で「行」を入れて、それは、3つの異なる列の最後のセルです）

は、ここで私が達成したいもののスクリーンショットです：

Hereは何IのJSFiddleですこれまでのところあります。私は多分、このビットはそれを行うだろうと思ったが、それはないようです：

div.new-region-page div.three-col-buys a.read-more { 
    align-self: flex-end; 
} 

私は2つの主要な問題を抱えて - 整列するために、「詳細を参照してください」細胞を取得し、全ての列で同じ長さに垂直の境界線を拡張します。

フレックスカラムの代わりにフレックスローを使用するオプションはありません。これは、フレックスカラムがモバイルで応答しなくてはならないためです。

私はフレックスボックスでこれをどのように達成できるか、誰かが助言してくれることを願っています。少しの成功で様々なflex属性を試しました。

Answer 1

表示する列コンテナ（＃top-buy）を設定する必要があります。 3列全てを同じ高さにする。

あなたは、彼らはすべてのあなたはフレックスの成長を追加する場合は、スペースの間

設定から広がっていないので、あなたの列の内容を調整できることをやるたら：0; div.new-region-page a.read-moreに移動すると、下に移動します。