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

Responsive landing page using CSS Grid

Josh 40

@jokings

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


This is my first challenge Feedback is welcome Thanks

Community feedback

Osaro Iyoha 1,080

@osaaroh

Posted

Hello Josh,

Welcome and good work in completing the challenge. Here are some suggestions:

  • If you want to center your card I recommend you to remove all the margin on "section", put <section> inside a <main class="card-main"> tag with the following attributes:
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;

The first three is to center in the middle and the last one takes all the size of the height of the device that sees it and if the content is bigger the box is enlarged for that reason it is minimum of height.

  • You can use the "View Report" section for recommendations and implement them to make your code better

Marked as helpful

0

Josh 40

@jokings

Posted

@Master-Osaro Thanks

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