Design comparison
Solution retrospective
.
What challenges did you encounter, and how did you overcome them?.
What specific areas of your project would you like help with?.
Community feedback
- @rayaattaPosted 10 months ago
Hi Sonali-negi, congratulations on completing this challenge π I have some tips you might find useful.
1 Every html document must have a main tag that encloses the main page content. Change
<div id="card">
to<main id="card">
using semantic markup improves SEO* and user experience for people using assistive technology like screen readers. You can learn more about the main tag in this articleπ°. 1 In order to make your card more responsive, Do not use fixed sizes a you did herewidth: 385px;
this will not display properly on screen whose width is below 385px, in order to solve this problem change this declaration tomax-width:min(90%,385px)
This means that when a screen is can't display 385px,it will resize the card to 90% of the available width. You can check out this articleYour solution is awesomeπ€©
Happy coding π
Marked as helpful0@SONALI-NEGIPosted 10 months ago@rayaatta , Thank you so much for the constructive feedback and valuable tips! π I appreciate your recommendation, and I have made these changes. I'm glad you liked the solution! π₯³
Happy coding to you too! ππ©βπ»
1
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