[Resolved] GeneratePress / Elementor single post image alignment

[Rolf]

Hi, I am running Generatepress / Elementor on my site, and it might be that this issue I am having is caused by Elementor, not GP.
– I am editing blog posts with default WP editor (Gutenberg)
– Images in this blog posts are centered
– When the blog post ist rendered on front end, all images are aligned left.

Any tip on what causes that?

Blog public image left aligned: https://monosnap.com/file/RPpboqY6mHhQAwMIZ61ebbReHVQAhS
same Blog in edit mode: https://monosnap.com/file/S8vlnHxswo99q128rvAqCzlBX7ZBn6

-rolf

[David]

Hi there,

yes its Elementor’s CSS causing the problem, this:

.elementor .elementor-widget:not(.elementor-widget-text-editor) figure {
    margin: 0;
}

Is overwriting this:

.wp-block-image .aligncenter {
    margin-left: auto;
    margin-right: auto;
}

Something they need to address. I did raise an issue with them on Git regarding the above CSS effecting WP widgets, this is the same thing:

https://github.com/elementor/elementor/issues/6403

In the meantime you can add this CSS:

.elementor .elementor-widget .wp-block-image .aligncenter {
    margin-left: auto;
    margin-right: auto;
}

[Rolf]

Thanks, David, great support even if it’s not caused by GP.
I also opened a support request and pointed them to this issue.
-rolf

[David]

Glad to be help. … I hope they respond to you more favourably 🙂

[Author]

Posts