Skip to content
OverviewSolutions
4
Comments
3
Kainã Mazim
@KaMazim

All comments

  • Shahin NJ•1,190
    @SJ-NosratSubmitted over 3 years ago

    In the mobile design I've wrapped my images in a <figure> tag and applied a background-color to the tag. The reason is the use of the "mix-blend-mode: multiply" in CSS to the <img> tag to obtain the overlay effect, since the <img> tag will use the parent's container background-color to achieve this effect.

    However, you'll notice that the <figure> height is much taller than the actual image, and I get the horizontal pink/purple line.

    How to I overcome this?

    Thanks in advance!

    Stats Card Component

    2
    Kainã Mazim•115
    @KaMazimPosted over 3 years ago

    Hi, to make the figure's height fit into the image height you could add the display:flex property in the .flex-item class.

    Marked as helpful
    1
  • Kainã Mazim•115
    @KaMazimSubmitted over 3 years ago

    I had difficulties sizing the image and choosing responsive break points. Any tip related to that would be useful.

    Use of FlexBox

    2
    Kainã Mazim•115
    @KaMazimPosted over 3 years ago

    Thank you. I was trying to use the lesser quantity of @media queries I could.

    0
  • Kainã Mazim•115
    @KaMazimPosted over 3 years ago

    Hi, some of your footer images are lacking alt attribute and you shouldn't use the H1 tag more than once. But apart from that, it's really good. Well done.

    Marked as helpful
    0