Delete padding between rows

Hi Kluong,

As you’re a Vantage Premium user, you’re entitled to priority email support – which is much faster than the forums. If you would like to make use of that, please follow the instructions found on this page. Please reference this thread.

The following CSS doesn’t do what you want it to do:

.panel-grid-cell {
margin-bottom: 0 !important;
}

SiteOrigin Page Builder doesn’t apply bottom margin to the panel grid cell (which basically means it’s a column). It instead applies it to the parent row – .panel-grid. This means that the following CSS will do what you’re after:

.panel-grid {
margin-bottom: 0 !important;
}

It should however be noted that we instead recommend setting the bottom margin via the page builder settings which can be done at WP Admin > Settings > Page Builder and then open the layout tab. Set the row bottom margin to 0. This way you’re able to override this if desired as this setting is merely a default.

The following CSS uses an invalid CSS selector.

.home-2 #main { /”-2″ because the page link is /*http://the-red-relocators.com/home-2
padding-top: 0px !important; /tried with 35px as with 0px
padding-bottom: 0px !important; /tried with 35px as with 0px
}

Basically, WordPress won’t add the post / page slug as a body class. Body classes are easy methods of targeting specific pages. For example, as this page is marked as the home page it has the .home class attached to the body. Meaning if you removed -2 it would work as expected.

It should however be noted that this CSS doesn’t remove spacing between rows and merely removes the standard Vantage content area padding (which is 35px). Here’s a visual example of what I’m talking about:

The green area is the padding applied. Your CSS will remove the top and the bottom (not pictured) padding. It’ll look like this once it’s removed:

Lastly, it should be noted that there still is padding being applied. To adjust this please open up the affected row by clicking the wrench above it and then navigate to the row styles sidebar. Open the layout settings group and set the padding to 0. I would not recommend a CSS method for this padding is quite needed. Regardless, you can use the following CSS to remove the vertical padding.

.panel-row-style {
  padding: 0 20px !important;
}

Set the above padding to 0 to completely remove the padding – this is something we recommend even less as horizontal padding is very much desired for readability.

Let me know if this helps. :)

Hi Kluong,

Oh sorry, I ommited the .home from my final CSS. I meant:

.home .panel-row-style {
  padding: 0 20px !important;
}

Regardless, regarding your CSS – that won’t work as layout-full is a class, not an element. So the following CSS will work as expected.

.layout-full .panel-row-style.no-bottom-padding {
margin-top: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
margin-bottom: 0 !important;
}

It should be noted that this will only be applied to whatever rows you add that class to (while obvious, I’ve still got to point that out).

Being handled via Premium support.