Design comparison
Solution retrospective
dynamic sizing is a bit of an issue
Community feedback
- @vanzasetiaPosted over 2 years ago
Hi, Ngewe! 👋
Good effort on this challenge! 👍 It's great that you are using
widthandheightattributes for every image. By using those attributes, it would optimze the CLS (Cumulative Layout Shift).However, I thought that there are two things that can be better.
- Firstly, I would recommend removing all the
nbsp. I'm not sure what is the use case of them, but if you want to create a space between the two elements, I would recommend using flexbox. - Secondly, on mobile landscape view, the card is broken. So, I would recommend you learn more about CSS and then come back and fix this issue.
Also, I would highly recommend removing all the tags that are currently applied to this solution. You don't use any of the technologies to build the site.
It's important that you are only using the correct tag for your solution because in the future if you are going to set yourself as available for work, and then the recruiters see your solution tagged with Sass or JSS but you're not actually using it, you might get a red flag.
All I have to say is that you need to learn more a bit about CSS in general and about responsive design and then if you want you can fix all the issues that I have mentioned.
That's it! I hope this information is useful! 😁
0@IzzyDoesPosted over 2 years ago@vanzasetia thank you so much, I’ll take note of these right now and make fixes to them.
0 - Firstly, I would recommend removing all the
- @Hamza-NoahPosted over 2 years ago
Hey To get rid of the accessibility/HTML issues shown in your Report:
wrap everything in your body in <main> or use or give role="" to the direct children of your <body> have at least one <h1> in your code
and now let us move to the design feedback let me give you some feedback here first, make the card centred vertically second, try to use the same font size and line-height for the paragraph after the card title third, increase the size of the icons and text after the paragraph fourth, you are using too much padding horizontally try to make it close as possible
hope this will be helpful
0
Please log in to post a comment
Log in with GitHub
Join 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