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

Four card feature section - CSS Grid

@nsvonod12

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

Practice my CSS skills

What challenges did you encounter, and how did you overcome them?

I didn't remember how to arrange the cards

What specific areas of your project would you like help with?

At the moment, none

Community feedback

P
Jamie Reed 120

@jreed-11

Posted

Nice try with this project and i see you used made good use of grid for desktop and flex for mobile and using custom CSS properties with custom varibles. only advice i could give was is getting the correct width of the Card and title containers slightly bigger than desgin. maybe USe rem units rather than %.

To set the oder of the flex items you can use the order property see here https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flexible_box_layout/Ordering_flex_items to rearrange the order of the flex items.

Overall good effot just the width sizes needed to be a bit smaller.

1

@nsvonod12

Posted

@jreed-11 Thank you very much really

Yes, I always fail in sizes and width. When I develop it looks great, but when I see the solution I realize that my solution is bigger :c

0
P
Jamie Reed 120

@jreed-11

Posted

@nsvonod12 sometimes i have done that and reliase my browser is not zoomed to 100% so could be to look out for

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