Design comparison
Solution retrospective
Hi! I really appreciate your advice and suggestion, thank you :D
Community feedback
- @techantherePosted almost 3 years ago
Hey, your solution looks good except I see the semantics have been totally ignored in the code which is not a good thing at all. You should definitely give it a try to resolve the issues in the report. Other than that the card is not centered vertically so adding some vertical padding on the body will center it. Another thing is it's breaking on smaller screens might be tuning the card width for smaller screens should work. Everything else's fine :)
1@zulhamsyPosted almost 3 years ago@techanthere, I added semantics markup as you suggest, now accessibility issues are gone, thanks!
btw, I try with small screen (393px) and its still looks good and not breaking at all, what resolution are you using?
0@techantherePosted almost 3 years ago@zulhamsy great to hear you have resolved accessibility issues, for size so that's the reason it's visibly fine till 400px on dev tools but I have checked on my phone it's breaking there. It means that for screen sizes smaller than that it starts breaking it's good to consider smaller screens up to 320px.
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