Align only one element inside a div to the bottom

[avlj (Andrea La-Rosa Jimenez)]

Hello. We have a section farther down on the new home page we’re working on called Cybersecurity Resources that contains three tabs, each housing a collection list. See screenshot below.

How do we align ONLY the “Read post” link in the NEW BLOG POST collection items to the bottom of the div container and keep both the BLOG POST and the title and excerpt aligned to the top?

Alternatively, is there a way to make a text/paragraph element display only a certain word count and then cut it off with a “…” so that all the collection items have the same length excerpt and (theoretically) the READ POST links still end up aligned horizontally?

Thank you.

---

Here is my site Read-Only: LINK

[memetican (Michael Wells)]

A number of ways but the easiest is probably-

Wrap your card’s title and text in a DIV [1], keep the link separate

Make the parent DIV [2] flex, flow downwards, space-between [3]

[avlj (Andrea La-Rosa Jimenez)]

Thank you! Unfortunately that’s not the section I was looking at, and following your directions (see below) didn’t serve to make the “Read post” links all aligned to the bottom of the parent div.

What am I doing wrong? Appreciate your help!

[AJ_Dev (from Memberstack)]

Hey @avlj ,

You are half-way done for sure. Can you set the ebook-resource-card element’s ‘Display’ and ‘Direction’ properties as highlighted below:

And then set the ‘Sizing’ of the Div Block 437 element as highlighted in the following screenshot:

This should ideally give you the structure based on your requirement. Hope this helps.

[avlj (Andrea La-Rosa Jimenez)]

Brilliant! That totally worked. Thank you so much!