Design comparison
Solution retrospective
Hello, mentors!
please, I would really appreciate an honest review of my project.
Help a newbie grow.
Thank you.
Community feedback
- @correlucasPosted over 2 years ago
👾 Hello Tobby, congratulations for your new solution!
I'll give you my sincere review as you asked:
1.Sice you've used
grid
inside the container, there's no need to set the column sizes as you've usedflex and width
for each column. You'll need flex only for the column with the product info.Set the container columns with
grid-template-column; 1fr 1fr;
for a grid with two equal columns..container { display: grid; place-content: center; min-height: 100vh; grid-template-columns: 1fr 1fr; }
Fixing that the rest is really good done, my tip is to fix only one thing in the mobile version, the product image should be a little bit smaller, so you can use a value for the
min-height
around 25vh or set a new media query. Code below:.image { max-width: 100%; min-height: 35vh; background-image: url(./product-preview-card-component-main/images/image-product- }
Hope it helps, happy coding!
Marked as helpful1@TobbyFrancPosted over 2 years ago@correlucas Wooow! Thank you so so much for the review. I really appreciate your time... I will get on with the corrections asap. You have added to my knowledge. Thank you for being a mentor.
1
Please log in to post a comment
Log in with GitHubJoin 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