Aligning flexbox items

[EStratton]

I’m working on redesigning a Related Posts section here:

An Introduction to Mobile Home Park Investing

I’m having trouble getting the 3 items to flex horizontally instead of vertically, and I’d love any help/suggestions.
Thanks!

[system]

Hey @EStratton

Add this code in your module css it will work

.blog-related-posts__post {
flex-basis: 100%;
margin: 0;
}
.blog-related-posts {
display: flex;
flex-wrap: wrap;
}
article.blog-related-posts__post-wrapper {
width: 33.33%;
padding: 15px;
box-sizing: border-box;
}

@media screen and (max-width:991px){
article.blog-related-posts__post-wrapper {
width: 50%;
}
}

@media screen and (max-width:567px){
article.blog-related-posts__post-wrapper {
width: 100%;
}
}

Hope this helps! If we were able to answer your query, kindly help the community by marking it as a solution. Thanks and Regards.

[EStratton]

Hi, Chehak -
That helped the layout - however, the images and cards disappeared. Can you help me get them back?
Thank you!

[system]

hey @EStratton

Add this code
.blog-related-posts__post-image {
display: block;
}