the display grid ; a lot of percentages insead of pixels
Design comparison
Solution retrospective
-I had some difficulties with th sizes and font, i didn't found some font ! -Why dont you give a size of the block tha contains the product-card -I really need advice on how to improve
Community feedback
- @correlucasPosted over 2 years ago
๐พHello Nelson, congratulations for your new challenge solution!
I've some tips for you to improve it:
1.First of all add the correct color for the background, in this case the cream color is
background-color: hsla(30, 38%, 92%, 1);
2.To align correctly the component you need to remove the margins and use flexbox/min-height. See the corrections below:
body { display: flex; flex-direction: column; justify-content: center; align-items: center; /* margin-top: 100px; */ font-size: 15px; min-height: 100vh; background: hsla(30, 38%, 92%, 1); }
3.For a better management for mobile and desktop images use the <picture> tag to wrap both of them and set in the html the moment when the images should switch between devices.
Hope it helps and happy coding!
0
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