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

Grid system <3

HelalAboodβ€’ 200

@HelalAbood

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


Hello, Frontend Mentor coding community,

This is my solution for the Columns Preview Card

Feel free to leave any feedback and help me to improve my solution (or) make the code clean!

Got some experience in handling layout with css grid πŸ‘¨β€πŸ”¬ I'll be happy for your Follow :)

Waiting to hear from you any feedback and advice!

Have a great day!

Community feedback

P
visualdennisβ€’ 8,375

@visualdenniss

Posted

Hey there,

good work with the css grid and congrats on completing the challenge!

I've spotted an issue: when hovering over the buttons, a border of 1px gets added to it and causing the height of the overall containers to increase, resulting in a glitch effect. I'd suggest having border: 1px solid white; for the button itself instead of button:hover; this way it will stay stable.

Hope you find this feedback helpful!

Marked as helpful

0

HelalAboodβ€’ 200

@HelalAbood

Posted

@visualdenniss Ohh, Thanks for reviewing my code. Glad that you noticed the issue and gave an advise to fix it. I fix it. It was helpful for sure, Thanks again.

1
P
visualdennisβ€’ 8,375

@visualdenniss

Posted

@HelalAbood No problem, happy to be helpful and glad to hear it fixed the issue! Good luck on the next challenges.

1

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