Image display on tablet

Hi there,

in the (current 1.x) free version of GenerateBlocks it will require some CSS:

@media(max-width: 1024px) and (min-width: 769px) {
    .tab-bg-adjust:before {
        background-position: 37vw bottom !important;
    }
}

Then select the Container block with the background image and in Advanced > Additional CSS Classes add:

tab-bg-adjust

Looks ok to me. Screenshot for reference:

https://app.screencast.com/9VMUfCRsrcfL1

And this CSS:

@media(max-width: 1024px) and (min-width: 769px) {
.gb-container-0af9db98:before {
    background-position: right bottom;
}
}

Yes.

The container’s ID has been changed, so the CSS can no longer work.

To prevent it from happening again, edit the page, select the page hero container with the background image, and add a class to it, e.g., page-hero-bg.
Adding CSS class(es): https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

Then change the CSS to:

@media(max-width: 1024px) and (min-width: 769px) {
.gb-container.page-hero-bg:before {
    background-position: right bottom;
}
}