How to have a background image in the footer

[CIDAdmin]

How can I make a background image in the footer to take up the whole space? As seen in the pic attached there is currently still some padding

[KlaraSchmitt]

It's likely you're not attaching your background image to an HTML element high enough in the code structure. Is your background image on .custom-footer?

[RaymondGoodeJr]

I'm working on this with CIDAdmin.

I have tried to use .custom-footer but the image does not show.

Here is what I have in the CSS

.custom-footer {
background-image: url("https://dev-intapps.imf.org/depts/CSF/CLab-DemoSpace/PortWatch/footer.png");
background-size: cover;
background-color: #004C97;
padding: 0px;
height: 350px;
}

[KlaraSchmitt · Accepted solution]

Hi @RaymondGoodeJr,

Try putting a different wrapper in your custom footer HTML box and attaching your image that way. I was able to add a background-image using your code to my site with this as the sample HTML and it didn't add any padding. I hooked your CSS to footer-background. I could not verify with your image as trying to load your image gives me a "site cannot be reached error."

<div class="footer-background">
<!-- footer content here -->
</div>

[RaymondGoodeJr]

Thanks @KlaraSchmitt for the reply but that didn't work either.  I just put in the exact thing you have with no other stuff and it's still not working.  See attached image.

Any other suggestions?  This just seems weird. 

[KlaraSchmitt]

@RaymondGoodeJr 

Do you have other custom CSS on that site? My next guess would be that you have some inline CSS that is unintentionally having an affect on your footer due to non-specific enough target selectors. You might want to look through any custom styles for classes that have padding or affect sections.

[RaymondGoodeJr]

would css in the header affect the footer? I'll continue to look around.