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 using React and CSS grid

@rainof

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?

I am most proud of learning how to adjust layouts using Flexbox and CSS Grid. Initially, I was quite confused, and it took some time to understand and visualize the final outcome. Despite the challenges, I am proud of completing something that closely resembles a real-world website. Next time, I would start with simpler examples to build a better foundation before tackling more complex layouts.

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

The main challenge I encountered was the confusion and difficulty in understanding Flexbox and CSS Grid at the beginning. It took some time to grasp the concepts and imagine the final layout. I overcame these challenges by dedicating extra time to study and practice, which eventually led to a better understanding and successful implementation.

Community feedback

@keinermendoza

Posted

I have to say congratulations 👏👏, you did an excellent job on both mobile and desktop.

If I have to suggest something for improvement, it would be about the class names that use a combination of numbers. I don't think it scales well. But again, excellent work!

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