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

Project Tracking Dashboard

@codefolk

Desktop design screenshot for the Project tracking intro component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Cropping and placing the image was frustrating, and didn't find any way to place color in the background. Really need feedback and suggestions. Happy coding.

Community feedback

@andrew-g-ayad

Posted

Hello @codefolk This background appears to be a separate HTML element positioned behind the image.

  • So, try creating a new div and style it with the same grey color and the border radius.
  • set the positions to absolute
  • make the z-index: -100
  • give it a width and a height
  • position it behind the hero image

remember to handle its position to match the design of the mobile version.

0

@codefolk

Posted

@andrew-g-ayad Much appreciated. I'll look into it

1

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