Design comparison
Solution retrospective
I had challenges in getting this result All corrections are welcome Thank you
Community feedback
- @AhmadHamidoPosted about 2 years ago
-Your design looks REALLY good! By the way, I don't know if you have started grid or not yet, but personally I would do this in grid. I found it so easy to position stuff on the page, even though learning grid is a bit challenging in the beginning, but once you practice on it, it would be a great help. I studied flexbox and grid on scrimba with the famous Kevin Powell, and I learned a lot from him. I also used this website in my free time as a practice on my flexbox and grid skills, so feel free to try it out (https://mastery.games/)
-Oh and btw you could also do is using the "em" unit for border, padding, and margin, and the "rem" unit for the font sizes.
Marked as helpful0 - @thisisharsh7Posted about 2 years ago
Hey Oluwatosin, Good Job! your solution really seems perfect. But there are some improvements from my side which could be made
-
Instead of giving
.cover{ position: absolute;}
for aligning the content to the center you can usebody{ min-height: 100vh; display: flex; align-items: center; justify-content: center; }
in your solution. -
Avoid more use of px units for setting width or height of an element like here
img{height: 200px;}
instead you can replace it to percentage units likeimg{ width: 100%}
in this way image could be much responsive.
I hope this helps you..
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