Design comparison
Solution retrospective
The placing of the entire item at the center actually gave me little issue before I could get it.
Community feedback
- @wendyhamelPosted over 2 years ago
Nice job on figuring out how to center the card with flexbox.
This is another method of centering an item with grid:
display: grid; place-content: center;
You can remove the
height: 70%
from your product container, it only stretches the card too large on larger screens, and squishes it on smaller screens.Try adding media queries for the smaller screen sizes, or better yet, make mobile your starting point and work your way up to desktop size with media qieries (one or two should be more then enough for this challenge, just mobile and desktop I should think, maybe add a tablet in between.)
You should take a look at the issues in the report. Look at the learn more to read some more information about the issues. These can help you with the basics.
Happy coding!
Marked as helpful0
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