Overlap images on Coloured Backgrounds

Hey whdsolutions,
Thank you for the link and screenshot, for the one page you linked to you could use this css:

#av_section_1 > div > div,#av_section_2 > div > div {
	padding-bottom: 0px;
}

#footer {
    z-index: 0 !important; 
}
#av_section_2 > div > div > div > div > div > div > div > div > div > img {
	margin-bottom: -40px;
	z-index: 5
}
#av_section_1 > div > div > div > div > div > div > div > div > div > img {
	margin-bottom: -50px;
}

But I notice that there are other pages with these two elements, so to have these work on all pages please add a custom ID such as “hands-up” and “inspection-copies” on every page they show.

After you do this then this css should work:

#inspection-copies > div > div,#hands-up > div > div {
	padding-bottom: 0px;
}

#footer {
    z-index: 0 !important; 
}
#hands-up > div > div > div > div > div > div > div > div > div > img {
	margin-bottom: -40px;
	z-index: 5
}
#inspection-copies > div > div > div > div > div > div > div > div > div > img {
	margin-bottom: -50px;
}

Best regards,
Mike

Hi,
There are a couple of ways to do this, since your two sections look like they are always above the footer you could create a custom page as footer which includes these two sections,

but you still need to add the custom IDs to the sections otherwise they will have different IDs for each page. Another option is to copy the two sections, with the custom IDs, as a template

then as you build each page you can click one button to add the sections. When you build the pages now how are you adding the sections?

Best regards,
Mike