How to change row padding between Page Builder widgets?

I can’t find a way to reduce the vertical padding / spacing between a text widget and a video widget (or just about any two widgets) in Moesia Pro using Page Builder. Each time I drag a new widget onto the page it looks like an inch and half of space is added between them. I’ve tried a variety of remedies, both exploring here and on the Page Builder support forums, but nothing seems to work. Do you have any suggestions? This page contains one instance of the issue: http://aftercoal.com/?page_id=10 .

One of the things I tried was updating (via Simple Custom CSS) the following CSS code (after finding this: https://siteorigin.com/thread/remove-spaces-in-between-rows-in-page-builder/ ):

.panel-grid-cell {
margin-bottom: 0 !important; /* Adjust the number on this row as desired */
}

#main {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

I also tried changing the Row Bottom Margin setting in the SiteOrigin Page Builder Settings area. Reducing it to “1” left me with more than an inch of vertical padding (though I can increase the padding by increasing that variable, so it seems to have some impact.)

I also reviewed this thread but that didn’t seem to offer any conclusive assistance: https://wordpress.org/support/topic/row-spacing-too-big?replies=7 .

I’d be thrilled if you could point me to the way to reliably reduce the padding between Page Builder widgets. Thanks!!

Hello,

Glad to see you tried various options.
Here’s the code you need to add in the Simple Custom CSS plugin that you mentioned:


.panel.widget,
.panel-grid-cell section {
    padding-top: 80px;
    padding-bottom: 80px;
}

Change 80px to the value you want.

Hah! Works like a charm. Thank you!!

Thanks, I was looking for this as well.

Is it possible somehow to do that only one specific page? Page-ID didn’t work for me:

.page-id-2222
.panel.widget,
.panel-grid-cell section {
padding-top: 80px;
padding-bottom: 80px;
}

Thanks!

If you’ve added exactly like you posted it here, then yeah, it wouldn’t work. Do it like this please:


.page-id-2222 .panel.widget,
.page-id-2222 .panel-grid-cell section {
    padding-top: 80px;
    padding-bottom: 80px;
}

Hi

I have inserted 2 widgets in a row at myespace.co.in.

How can I reduce space b/w these 2 widgets (about Organizers and Button).

Thanks

I am using the Moesia theme and cannot get the custom CSS to work as prescribed above. See my spacing issues at: http://ywcpas.com/our-services/audit-assurance/.

I’m using the Edit CSS, CSS Stylesheet Editor, and pasted the following code:

.panel.widget,
.panel-grid-cell section {
padding-top: 10px;
padding-bottom: 10px;
}

I would also like to override the H3 widget title size. Please advise.

Thanks

I just figured it out. I have Moesia, the spacing is defined in the theme css

.so-panel.widget,
.panel-grid-cell section {
padding-top: 10px;
padding-bottom: 10px;
}

Hi I’am developing a website and I’am using site origin oage builder I’am don’t want the whitespace between the rows please help me ASAP. Please have a loook at the site for better idea.
OctaDigi

HI am developing a website using the Sydney theme. I’m also having problems removing the white space between the page builder rows. I tried following code:

.panel.widget,
.panel-grid-cell section {
padding-top: 80px;
padding-bottom: 80px;
}

in my CSS editor as suggested by Vlad but still no change. Please am i doing something wrong/ would really appreciate any help. The website am working on is www.jobijobientertainment.com

Hi ,
I want to add horizontal lines between each (rows)sections of Page Builder Widgets in Sydney theme Landing page.
How to bring the horizontal lines to differentiate between each rows of Page Builder Sections.

Thanks…