Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
Ability to develop a responsive web page.
What challenges did you encounter, and how did you overcome them?I encountered challenge in making the page responsive.
What specific areas of your project would you like help with?Javascript.
Community feedback
- @dliferovaPosted 8 months ago
Hello, great job! I would advise you
- to use semantic HTML markup (such as section, main, etc.), it will help you maintain better organization and improve code readability.
- be mindful of having only one h1 heading per page in your markup.
- sometimes you style elements based on classes, and sometimes based on ids; it's better to stick to one approach and style elements only by classes.
- additionally, avoid using abstract names like id="a" or class="karma"; try to denote the element's semantics through the code, for example, class="karma-card", which immediately indicates that it's a card. You can use multiple classes on one element and eliminate ids, for example, class="card-s karma-card".
- I also noticed that the "supervisor" card has a narrower width than the others; it might be something worth correcting.
Good luck with your future projects!
0 - @tatyanepgoncalvesPosted 8 months ago
Hello,
For the layout to be responsive you should use
media queries
and to make it better instead offlex-direction: row;
you should have putflex-direction: column;
.In this link you can find a little about it.
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