Archived topic
Footer Area Background and Spacing
3 replies · Started by Elzanne Cronjé on August 1, 2019
Viewing posts 1–4 of 4
I have used a background image for the footer bar, but would also like to give it a color overlay. How do I do that in CSS?
Also, if I add a widget to the footer bar area, it automatically positions to the left of the copyright text. Is there any way that I can have the widget in the center above the copyright text?
Hi there,
the simplest way is to add the overlay and the image using CSS and take advantage of the linear gradient property:
.footer-widgets {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('full_image_url_here');
}This CSS will stack the site info widgets and centre align them:
.inside-site-info {
display: flex;
flex-direction: column;
align-items: center;
}Thank you David! :-)
Glad to be of help
This archived topic is closed to new replies.
