Skip to content
Submitted about 3 years ago

solution using grids

yamen•190
@YamenAlzeiter
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...3-column preview card component
  • HTML
  • CSS
1newbie

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 MALIK•345
    @Shahab-MalikkPosted about 3 years ago

    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

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