Positioning of lazyload images in Lightweight Grid Columns

I tried to deactivate LGC on local site and the mobile header logo is still looking weird so the LGC is not the problem there.

Maybe the problem with the background image that weren't loading and the images that didn't load until I refreshed the page had something to do with my hosting because they had many problems at the moment. I don't have that problem on local.

I will try again later on the live site.

Sounds good :)

The only problem that I can see now is mobile logo that becomes smaller with wrong ratio. I read on this page https://docs.wp-rocket.me/article/15-disabling-lazy-load-on-specific-images that you can disable lazy load on specific images by class. How can I add a class to the image in mobile menu? Or do you have another better idea?

Here's the link to my site. https://xn--budgetbrllop-cjb.se/

I noticed it's not every time the logo gets weird but when you refresh the page it does and only on smaller screens.

Give this function a shot:

add_filter( 'generate_mobile_header_logo_output', function( $output ) {
    if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
        return $output;
    }

    $settings = wp_parse_args(
        get_option( 'generate_menu_plus_settings', array() ),
        generate_menu_plus_get_defaults()
    );

    return sprintf(
        '<div class="site-logo mobile-header-logo">
            <a href="%1$s" title="%2$s" rel="home">
                <img src="%3$s" data-no-lazy="1" alt="%4$s" />
            </a>
        </div>',
        esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
        esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    );
} );

Adding PHP: https://docs.generatepress.com/article/adding-php/

I have added the code via Code Snippets but it don't seem to work.

Hmm that's strange. The code snippet is "active"? Any caching plugins?

Oh, of course you are right! I thought I already had emptied the cache but I hadn't. It works like a charm!

Thank you very much.

You're welcome :)

I had the same issue as these people - enabling lazy load created white space under column. Problem resolved by adding equal_heights="false" to shortcode

However, it creates a ton of image height issues. Is there another fix for this? Any way to disable the conflicting code without creating the image height issues? PS I'm using lazy load from Siteground...

Any chance you can open a new topic for your question?