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

HTML, CSS

Declan 220

@engelbrechtz

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


Prior to the development of the card itself, I've implemented new changes, may I have feedback among the responsive section of the card to improve/develop on.

Kind Regards, DevDeclann.

Community feedback

@lalitwizz21

Posted

How did you color the image, I can't make it work and why you didn't use background image in this?

1

Declan 220

@engelbrechtz

Posted

@lalitwizz21

Hello lalitwizz21, hope all is well, the reason why I haven't implemented the background image in the responsive layout of design, is due to the fact that I was situated within school grounds, I didn't get enough time to complete it fully.

Regarding your question (How did you colour the image), I overlap with this in my class of desktop, then after that, I then proceeded to the colour that was provided within the style-sheet guide of what fonts & colours were used. That's it :) The desktop class was added into the img tag itself, used as img wrapper. I've inspected this onto yours & it worked! See ya. Have good day

Hoped this helped, Any further help, my discord is (dankymemeslolz22)

.desktop{ object-fit: cover; mix-blend-mode: multiply; }

.img-container { background-color: hsl(277, 64%, 61%); border-radius: 0 5px 5px 0; }

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