Skip to content
Submitted over 3 years ago

HTML, CSS, Flexbox and Media queries

Bulumko Papu•180
@bulumkopapu
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hey guys

I had fun developing this. One thing Im finding out with Front End Mentor is that the layouts they offer dont cover all screen sizes and dimensions, so a little interpretation is needed in order to make the code truly responsive at all screen widths.

Please review if you can make the time :-)

Community feedback

  • Mo•0
    @AlalouchPosted over 3 years ago

    Hey, I just have one question please, can you tell me how you could change the Pictures color? did you change it by using some code or how you did it? I already finished it but I'm struggling with this problem, hope you could tell me some tips!! thanks.

    0
    Nebiyou Ersabo•185
    @NebiyouErsaboPosted over 3 years ago

    @Alalouch Using dev tools, it looks like he manually edited the picture outside and inserted it on his html. But there is another way to go about this:

    • create a div that contains the image
    • set the background color of that div to hsl(277, 97%, 74%) or somewhere around there.
    • then on the image css apply mix-blend-mode:multiply and add some opacity (around 0.6-0.8) Try it and lmk if you got questions
    1

Please log in to post a comment

Log in with GitHub

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