Firstly, let me say how fabulous Page Builder is. I use it on most of our sites and it really makes site building so much easier. So thank you!!
I am having trouble, though, figuring out the CSS attribute section of the rows. I followed your tutorial but I’m just not able to make it work.
The site in development is here using Vantage theme:
http://5e9.238.myftpupload.com/
My very ugly css on the panel grid cells is currently directed at each individual page as:
#pg-54-0, #pg-54-1, #pg-54-2, #pl-54 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-54-3, #pl-54 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-484 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-484-0, #pl-484 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-486 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-486-0, #pl-486 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-493 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-493-0, #pl-493 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-495 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-495-0, #pl-495 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-488 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
#pg-488-0, #pl-488 .panel-grid-cell .so-panel:last-child {
margin-bottom: 35px;
}
#pl-490 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}
I’m sure there must be a simpler way to do this with the CSS attribute of the row but I just can’t seem to figure it out!
Any help will be greatly appreciated.
Hi Blacktankdesign,
Thank you for the kind words! :)
The Attribute CSS Styles field is actually only for inline styles so, for the most part, it won’t do what you’re after.
To do what you’re after you’ll want to adjust the global Row Bottom Margin and add some custom CSS.
Adjust Global Row Bottom Margin
You can also globally adjust the row bottom margin by navigating to WP AdminSettingsPage Builder, then open the Layout settings group and adjust the Row Bottom Margin.
Last widget in row bottom margin
Please navigate to WP AdminAppearanceCustom CSS and add the following CSS:
.panel-grid-cell .so-panel:last-child { margin-bottom: 35px !important; }You might also need to install the SiteOrigin CSS Editor.
Thank you so much!
I had completely forgotten about this section in the Administration. LOL
This solves more than a few of the problems I’ve been having!