How to reduce space between footer widgets

Hi Cynthia. By "reduce the space" do you mean you want to squeeze them all closer together towards the center, with a larger space on the far left and right sides of the footer?

You can maybe try something like this:

.inside-footer-widgets .inner-padding {
      padding: 0 20px;
}

Hello bdbrown

Hi Cynthia. By “reduce the space” do you mean you want to squeeze them all closer together towards the center, with a larger space on the far left and right sides of the footer?
Yes that is exactly what I mean.

Thank you! Cynthia

Expanding on Tom's CSS, I added some additional code for mobile views:

/* reduce space between widgets */
.inside-footer-widgets .inner-padding {
    padding: 0 20px;
}

/* push widgets right so equal outside spacing */
.footer-widget-1 {
    margin-left: 8%;
}

/* reduce width of widget container */
@media (min-width: 1025px) {
    .inside-footer-widgets .grid-25 {
        float: left;
        width: 22%;
    }
}

/* reduce width of widget container so all in one row on mobile*/
@media (max-width: 1024px) and (min-width: 768px) {
    .inside-footer-widgets .tablet-grid-50 {
        float: left;
        width: 25%;
    }
}

/* center widgets in column and remove left margin */
@media (max-width: 1024px) {
    .inside-footer-widgets > div {
        margin-bottom: 50px;
        text-align: center;
    }
    .footer-widget-1 {
        margin-left: 0;
    }   
}

Adding CSS: https://generatepress.com/knowledgebase/adding-css/

Hi!

I have a problem with footer widgets, they are all together with no spacing at all. I've tried the code Tom posted but it didn't help.

My sites address is http://datafix.dy.fi/huusholli/

Thank you!

@datafix - The code posted above is to reduce the spacing between the widgets. Your problem is the opposite so it would be better if you could start a new topic. Thank you.

Hi I am having the same problem with too much space between the footer widgets. I installed simple css and added the code

.inside-footer-widgets .inner-padding {
padding: 0 20px;
}

but nothing changed. You can view in my sandbox development site: http://ipep-genpress1.qsandbox.com/ (access code: 000).

Thanks,

Sylvia

Maybe try using contained here? https://docs.generatepress.com/article/footer-layout/