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 media queries

@SeNaTu24

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I found styling my project difficult especially using my "container width". I am also not sure on the responsiveness of the code. Looking forward to hearing from my learned co-developers on how to improve most especially my CSS.

Community feedback

Opeoluwa 330

@Opeoluwa-Ogunlaja

Posted

Hi! I think the best way to center a single element on the page is by giving the body ;

display: grid (i think flex can also work here)
place-items:center;

and making the height and width of the body full as well (asin 100vh and 100vw). After that, no more worrying about centering so you can just use percentages like you did.

0

@SeNaTu24

Posted

@Opeoluwa-Ogunlaja Thanks. I will put that into practice

0
Opeoluwa 330

@Opeoluwa-Ogunlaja

Posted

@SeNaTu24 👍👍

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