I am trying to figure out how to get to display two background-images in css so that the first background is a gradient image generated with css and then over that gradient to have some-image.png.
I tried adding someimage.png in another div above the div with gradient effect but I didn't find a way to add height to that div without messing up the page.
The idea is to have a gradient background and over that on the bottom of the page, an image that will have full page width, so I can not place it in the container div. I don't know if this is even possible :)
Any help would be highly appreciated!
This is the CSS code:
margin: 10px 40px;
background-image: linear-gradient(to bottom right, #A33030 0%, rgba(182, 69, 69, 0.88) 100%);
font-family: "Open Sans";
The HTML code:
<header><a class="logo"><img src="logo.png"></a><nav><a href="#">Blog</a><a href="#">About</a><a href="#">Courses</a><a href="#">Contact</a></nav></header>