Byron• 2,180
@byronbyron
Posted
It needs to be a background image instead and it needs background-blend-mode: multiply;
, so might look something like this:
<div class="image-container" style="background-image: url('images/image-header-mobile.jpg')"></div>
.image-container {
background-size: cover;
background-position: center;
background-color: hsl(277deg 64% 64%);
background-blend-mode: multiply;
width: 100%;
height: 100%;
}
Then add overflow: hidden;
to the .main-container
class to make sure it rounds off the corners.
Hope that helps!
0