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

solution using grids

yamen 190

@YamenAlzeiter

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 guys I just finish this challenge but I have some issues that I don't know how to fix

  1. in Firefox, the grid is broken, or it gives more width than it should be.
  2. when minimize the screen I can't see the first box, even when I set the display on the <body> to grid, but it work when I set it to block or inline. I really don't know what I am doing, It look easy but when I started I straggled.

thank you guys for your help <3.

Community feedback

@Shahab-Malikk

Posted

Hi Yamen implemented things well but you have to use a media qurie for screen of max width 900px you have to display grid-template-columns: 80% or like this

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