Skip to content
Submitted almost 4 years ago

HTML CSS SASS VSCODE GITHUB Task 2

Bhupender Singh•100
@bunny1351
A solution to the Stats preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hey everyone I'm facing few problems #1 I got 2 background colors behind img and can't use 'mix-blend-mode: overlay;'. I need help with that. #2 How should I set the width and height of the card since fixed heights like px aren't helpful with higher screen resolution? Should I be using vw and vh or em ? Please review and suggest improvements. Thank you

Code

Please log in to post a comment

Log in

Community feedback

  • Sean•175
    @sean-b765

    1- The mix-blend-mode works by blending the content of the element with other element's background. Setting the background of the img has no effect. You could wrap the img in a div and set the background of that div to alter how it looks.

    2- Set the width of the card using vw if you like. But always set a max-width if you are, otherwise large screens, like 4k, will be far too wide. Also you don't need to specify heights in most scenarios. The content within the container will automatically fill it, and you can apply a padding to make it look nicer.

    Hope this helps!

    Marked as helpful
  • Abhijit Paul•285
    @thexeromin

    Good work bro.

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