Align an element in the bottom of a card

[Swello_Marketing]

Hello!

I’m having trouble aligning content within cards, I want the bulleted content to align to the bottom and the image to align to the top.

---

Here is my site Read-Only:

https://preview.webflow.com/preview/swello-website?utm_medium=preview_link&utm_source=designer&utm_content=swello-website&preview=758c0f253761cd38b7744d2502b57013&mode=preview

[Swello_Marketing]

here’s another screenshot

[robingranqvist]

You could do this by doing the following:

• Set a min-height to the wrapping boxes. In my example I set it to 600px
• Set the wrapping boxes to “position: relative”
• Set the “Card Service Grid” to “position: absolute” and position them to the bottom
• Add a margin / padding to the “Card Service Grid” boxes similarily to how they were before

*I should add that you probably should tweak the min-height to get them to look a bit nicer than in the example above

[Swello_Marketing]

Amazing! Thank you!!

[Swello_Marketing]

Would you know how to do the same thing to a card with an image? When I follow the previous instructions, it stretches the image.
I’m trying to align the line and stats to the bottom.

https://preview.webflow.com/preview/swello-website?utm_medium=preview_link&utm_source=designer&utm_content=swello-website&preview=758c0f253761cd38b7744d2502b57013&pageId=5f5bfeac0f727352dd54d063&mode=preview

[Swello_Marketing]

Sorry, here’s an updated version, the “Million” was too long for that section.

[robingranqvist]

Hey,

do you mean something like this?

I did the following:

• Set a min-height for the card-wrapper (in my case 700px)
• Set the card-wrapper to “position: relative”
• Wrap the divider-line the “Case Study Card Results Grid” in a div block
• Set the new div block to “position: absolute” and align to the bottom
• Add padding to the new div block