Design comparison
Solution retrospective
All feedback is welcome thank you in advance.
Community feedback
- @Bader-IdrisPosted over 1 year ago
You can set the container in the middle of the screen whatever user changes it when you add these properties to it in CSS:
.container { position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); }
the new feature is transform, it has many lovely properties you can discover, I personally love it. Hope it's useful
0 - @apah-devPosted over 1 year ago
There are few things you could do to make your final result much closer to the solution.
-
use the recommended font-weight and font-family as advised in the styleguide.md file in the project documents you downloaded
-
use the background color recommended for the body to make it look much more like the solution. that would be background-color: hsl(212, 45%, 89%); in this case.
-
use border-radius to add some border to the main div and also seperately do it for the img too
-
you could increase the padding in the main div element to give some space between the content of the div and the border
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