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

@Rachana2002

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


What are you most proud of, and what would you do differently next time?

Learnt many things while doing this project and Im proud of whatever i have done in this project.

What specific areas of your project would you like help with?

Feedbacks are Welcomed

Community feedback

@gilotin

Posted

Hello, your repository is private or the link is broken, so we cannot see the code . If you want to get that darker effect of the image, like in the design, you can try to play with z-index and transparency. I don't know if there is better option right now.

Edit: I just saw your your HTML. It's good, I have just one suggest (it's mandatory , but will improve SEO optimisation and semantics) Always ask yourself if the div element you are creating are meaningful to the context, if so - find a better elements to swap it. Div 's are good only for wrappers and elements that doesn't provide any information (means) to the structure.

For example in your HTML you can replace one of the divs with section or article.

0

@Rachana2002

Posted

Hi Thanks for your valuable suggestion , yeah you are correct and I'll update HTML document.

0

@gilotin

Posted

@Rachana2002 I found better solution with ::before and ::after pseudo elements.

You can create the same effects without creating additional HTML elements.

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