Frontend Mentor | Four card feature section

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

Before writing any code for this project, I took some time to plan my approach. I outlined how I wanted to tackle the challenge, identified the appropriate HTML elements to use, and thought through the class structure—especially which containers could share classes based on similar styling. This planning phase really helped me understand the problem more deeply and develop a clearer mindset for implementation. It’s a step I found incredibly valuable, and I plan to continue using this approach in future projects.

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

I decided to make the font sizes responsive without using media queries by using the clamp() function. Choosing the right minimum and maximum values, as well as the appropriate relative units, took some time since I had to test the layout across different screen sizes. But in the end, it was worth the extra effort.

One challenge I still haven’t fully overcome is layout alignment. I initially used display: grid for the middle cards, but I struggled to center the card container within the body. Eventually, I switched to display: flex, which worked better in this case. It made me realize that I still have room to grow when it comes to mastering CSS Grid.

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

Any feedback is welcomed and appreciated!