I'll appreciate any feedback most especially on accessibility and responsiveness.
@elaineleung
Posted
Good job Hafeez! Just to follow on what the other said, you actually are really close to centering the card since you already got flexbox on your body element; all you need to do is a height property. To do that, I suggest min-height instead, so try adding min-height: 100vh; and also decreasing some of the bottom padding on the footer, and see whether that helps to center your card.
Once again, well done and keep coding!
Marked as helpful
@RafiiMahmudRiizvii
Posted
Hi hafeez, almost perfect. you just need to increase the border-radius and center the card. Thank you.
Marked as helpful
@elfreeze
Posted
@RafiiMahmudRiizvii Thanks for the feedback, Rafi! I've gone through my code and made corrections based on your suggestions. Please help me review the work again. I'll really appreciate it.
Thanks once again.
@Femi-Bright
Posted
To fix your accessibility issues, try to always wrap your whole content in a <main></main> or when you use a div, try to add a main role
<body>
<div role="main">
...
</div>
</body>
Marked as helpful
@elfreeze
Posted
@Femi-Bright Hi Bright, I've implemented your suggestion. Please do have a look at the work again.
Thanks for your help.
@Femi-Bright
Posted
@elfreeze It seems it worked as the solution does not have any accessibility issues. Nice one Hafeez, keep it up 👏
@Deevyn9
Posted
Hi Hafeez, great solution, try centering the main containers.
Happy coding 🎈
Marked as helpful
@elfreeze
Posted
@Deevyn9 Hi Divine, I've done that. Thanks!
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
