Responsive stats preview card component using flex-box
Design comparison
Solution retrospective
This is the first time that I have intentionally made one of these challenges responsive, so any feedback would be great.
Getting the colour on the images was a little tricky.
I got a little impatient with this towards the end so I may refactor the code in the upcoming days.
It took me much longer than previously expected.
//Updated my accessibility errors. Corrected typos. 04/02
Community feedback
- @Nick-GabePosted almost 3 years ago
Hi Arthur! Your solution is really responsive, good job.
But I would suggest you to use landmarks inside your body, they are super important for accessibility. You can see about it right here: W3schools - Landmarks
And at least for me, the
stats tab
makes more sense to be an unordered list instead a div.Nice solution, see ya Arthur👋🙂
Marked as helpful0@arfarobsPosted almost 3 years ago@Nick-Gabe
Hey, thanks for the link.
The unordered list seems like a great idea, I didn't think of that.
0 - @NaveenGumastePosted almost 3 years ago
Hay ! Good Job Arthur Roberts
These below mentioned tricks will help you remove any Accessibility Issues
-> Add
Main
tag after body like it should be your container. For 1st heading orh1
tag, use header tag and then inside the header put yourh1
orh2
etc . But use header tag only once in main heading element.Keep up the good work!
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