Design comparison
Community feedback
- @Ryan-OHanlonPosted 5 months ago
A very strong match to the desktop design. While the code is well structured, it could do better with added comments to understand what each section of HTML or CSS is doing what.
The color of Simple Omelette Recipe does not have any color attribute added from the style guide.
While the site is responsive to the desktop design, the webpage does not change to match the mobile design. You need to make a second set of CSS rules for the desktop using the @media rules and apply a min-width. Then put all the desktop rules to adjust the margin and padding for inside the @media rule.
/*Desktop CSS rules when wider than 375px*/ @media (min-width: 376px) { body{ } }
Also very good using the margin left attribute to create space for all listed elements and the table.
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