Design comparison
Solution retrospective
All feedback is welcome
Community feedback
- @FanushhhPosted about 2 years ago
Hello there fellow front-end developer!
First of all I wanna say congrats to you for the solution, it looks good and I want you to keep at it because you're doing great! As a few tips that I've also learned throughout my studies, I would recommend trying to set the background color to the body instead of the main because for the mobile version the background disappears. For the desktop version it's fine because you assigned it to the body which is correct so I assume it was just a simple mistake you added it to the main instead for mobile. Additionally, for the desktop layout things seem a bit off, first thing I noticed is that the text is not left aligned so that's an easy fix. Secondly, as I recently learned from a mistake I did, you might notice the img element does not cover the whole width of the div parent, that's mainly because you need to set all img element to have max-width of 100% and display block, it's part of a general reset of elements that you have to do to get as close to a blank web page as possible. Here's a link that I also got from a friendly developer on the platform that explains it: (https://www.joshwcomeau.com/css/custom-css-reset/) After that , you can maybe select the "last" div class and either make it uppercase to fit more into the original design either by change it in the index.html or you can go in css and add text-transform: uppercase both ways work, it's just about preference I guess.
Cheers!
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