Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

3 Column Preview Card Component

@jamesablanco

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I have questions on what I could have done to improve my design and also how to align the entire cards in the center correctly and possibly mobile?

Thanks! James

Community feedback

Yokke 640

@Jexinte

Posted

Hey @jamesablanco ,

When you need to center on mobile towards the design use display flex on your container with flex-direction and align-items : center property Yours cards are too close add some space with the gap property , more details on those property here : https://developer.mozilla.org/fr/docs/Learn/CSS/CSS_layout/Flexbox https://developer.mozilla.org/fr/docs/Web/CSS/gap

In hope it helps !

Marked as helpful

1

@jamesablanco

Posted

Awesome! Thank you I thought of using Display Flex but was confused about where but that helps me! Thank you for the feedback! I appreciate it a lot, I will try this and see if I can Update my submission or go back and look at the alignment

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord