- This topic has 3 replies, 2 voices, and was last updated 2 years, 12 months ago by
.
-
Posts
-
Hi There,
I’ve been trying to update the cards used on blog category pages to Flexbox so that I will align to the same height in each row no matter the amount of content.
Although I can’t get it to work 😕 Any ideas on what I’m doing wrong (link in private info)?
I set flex on the container that wraps the image and content of each card – perhaps is should be on the second container that holds the title and button?
Cheers
Customer Support
Hi Paul,
Based on your design, I would create a different structure, please refer to the screenshot below:
https://www.screencast.com/t/2IWj36yCu- Container A - Container B: background image set to featured image - Headline: list of terms - Container C: - Headline: title - Headline: excerpt - Button: read moreSettings for Container A:
– height:100%;
– display: flex;
– flex-direction: column;Settings for Container B:
– min-height: 250px;
– enable dynamic background image, set it to featured image;Settings for Container C:
– display: flex;
– flex-direction: column;
– justify-content: space-between;
– flex-grow: 1;Settings for the Button in Container C:
– margin-top: auto;THANK YOU Ying! 🙂
I’ll give this a try.
Paul
Let me know how it goes 🙂
- You must be logged in to reply to this topic.
