Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Stats preview card component - HTML, CSS, Flexbox

Emilioβ€’ 90

@E1000o

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello everybody. This is my solution for the Stats preview card component challenge. I would be grateful if anyone could give me an opinion about my code. I can't find a way to make the purple halo under the image disappear in the mobile version (it's the bottom of a transparent div I've used to change the color of the image, probably editing the image file would have been a wiser solution). Thanks in advance. Happy new year

Community feedback

Anosha Ahmedβ€’ 9,340

@anoshaahmed

Posted

To get rid of the accessibility/HTML issues shown in your Report, wrap everything in your body in <main> ... OR use semantic tags ... OR give role="" to the direct children of your <body> ... Click here to read more

Great job! :)

Marked as helpful

0

Emilioβ€’ 90

@E1000o

Posted

@anoshaahmed Thanks!

1
Emilioβ€’ 90

@E1000o

Posted

Turns out , the footer overlaps the main content on small screens. I believe it's because I've set the height of the body to 100VH. I'll just remove the footer, for now.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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