[Resolved] Alignment of column blocks, missing bottom padding

[Louis Stanford]

I’ve added three column blocks on my homepage (see link), but these are not aligned to the page content. I’ve tweaked every setting I can find, and also looked at all my Additional CSS for clues. Where am I going wrong?

Also, I’m puzzled why the padding at the bottom of my content (between content and footer widgets) is gone – in spite of my bottom padding size being 40px.

Using Chrome, Safari yields the same results.

GeneratePress 2.2.2

GP Premium 1.7.7

[David]

Hi there,

something very peculiar with your page set-up. For instance the pages are loading both left and right sidebars and yet they are both empty. Is this intentional do you know?

Could you disable all other plugins, clear any caches and let me know so i can take another look.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Louis Stanford]

Hi David,

Yes, it was intentional – I just had blank Custom HTML blocks to fill up the space. I’ve added a Search Widget to each Sidebar to help you make sense of it. The same thing (misbehaving block) happens when I make it full width (content only, no sidebars).

I’ve disabled all plugins, no cache.

[David]

The padding is missing because you have the pagebuilder layout set to contained. This and the full width setting strip out the padding as it is expected that the padding will be added by your pagebuilder….

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Louis Stanford]

I understand what you mean, but I can’t find that setting anywhere. I don’t use a pagebuilder either.

Have also looked up “page builder container” in the documentation but that seems to refer to a prior version of GP.

[David]

This:

https://docs.generatepress.com/article/page-builder-container/

Should be the Layout meta box in the post editor.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Louis Stanford]

Thanks David, took me a while.

Made a few tweaks with elements and have seen some improvements, but the right-most blue box is still not aligned correctly.

I’ve double-checked my Additional CSS – even with no CSS, the alignment is still wonky. This is about the simplest setup I could have.

[David]

yeah the GB columns block and its column gaps is a bit ‘loose’ shall we say and doesn’t consider the alignwide option.
You can overcome the lack of right hand margin on last element on desktop with something like this:

.wp-block-columns.alignwide .wp-block-column:last-child {
    margin-right: 40px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Louis Stanford]

That’s perfect, did the trick! I suspected a bug in GeneratePress, but, yeah, it is Gutenberg.

Thank you so much!

[David]

Awesome – glad to be of help 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts