How to arrange elements on the same level in height regardless of the content in the columns?

How to place links (marked in red) at the same level in height regardless of the content in the columns?
Should be like the picture below, the flex-end does not help, because is shifted the link, if you increase the text also on the screen it is not the end adjacent.

<div class="tiles">
 <div class="container-tl">
 <div class="tile chart">
 the <h3>SEO Optimized</h3>
 <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry''s standard dummy text ever since the 1500s, when an unknown printer took a galand scrambled it to make</p>
 <a href="#" class="plus">+</a>
</div>
 <div class="tile-pad"><h3>SEO Optimized</h3>
 <p>Lorem Ipsum is simply dummy text of the printing adustry''s standard dummy text ever since the 1500s, xt ext ever since the 1500s,ver since the 1500s,when an unknown printer took a galley of type and scrambled it to makemy text ever since the 1500</p></div>
 <div class="tile cloud"><h3>SEO Optimized</h3>
 <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry''s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make</p>
 <a href="#" class="plus"></a></div>
</div>
 </div>

.tl{
 display: flex;
 color: #fff;
 margin-top: 70px;
 justify-content: space-evenly;
 padding-left: 18px;
 /* padding-top: 30px; */
}
.tile{
 text-align: left;
 padding-left: 40px;
 margin-top: 0px;
 padding-top: 0px;
 width: 100%;
 padding-bottom: 20px;
 display: flex;
 flex-direction: column;
}
.plus{
 align-self: flex-end;
}


5cf32e164716e446623054.png
March 23rd 20 at 18:43
2 answers
March 23rd 20 at 18:45
Solution
The flake by using the margin auto on the right side, like so: https://jsfiddle.net/mtonzuj3/
Alternative: absolute.
March 23rd 20 at 18:47
position

Find more questions by tags FlexboxCSS