Gallery Block – Stacking on mobile

  • pghealy

    (@pghealy)


    4 years, 6 months ago

    Prior to version 5.9 I was using the following CSS to stack gallery images on mobile: 

    @media (max-width: 800px) {
    .wp-block-gallery .blocks-gallery-grid li.blocks-gallery-item {
		margin: 0 0 1em 0;
    width: 100%;
    }
}

    Now that the gallery block has changed with WordPress 5.9 this no longer works.

    Does anyone know what the new CSS should be to get gallery images to stack on mobile?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator t-p

    (@t-p)

    4 years, 6 months ago

    Looking at your site, you use uncode theme.

    Since you use a commercial theme or plugin and need support, please go to their official support channel. In order to be good stewards of the WordPress community, and encourage innovation and progress, we feel it’s important to direct people to those official locations.

    https://undsgn.com/uncode/

    Forum volunteers are also not given access to commercial products, so they would not know why your commercial theme or plugin is not working properly. This is one other reason why volunteers forward you to the commercial product’s vendors. The vendors are responsible for supporting their commercial product. Commercial products are not supported in these forums.

    Thread Starter pghealy

    (@pghealy)

    4 years, 6 months ago

    Sorry, I’m not sure why this would be a theme issue? There are several posts in the forum about getting Gutenberg images to be responsive (which is where I found the CSS that was working prior to version 5.9).

    I’ve discovered that I need to use:

    @media (max-width: 800px) {
    .wp-block-gallery figure.wp-block-image
    {
    margin: 0 0 1em 0;
    width: 100% !important;
    }
    }

    …in order to affect the gallery blocks with the changes in version 5.9. This is working, however, the top images are indented.

    My theme support couldn’t help because this is a Gutenberg thing.

    Moderator t-p

    (@t-p)

    4 years, 6 months ago

    in order to affect the gallery blocks with the changes in version 5.9. This is working, however, the top images are indented.

    My theme support couldn’t help because this is a Gutenberg thing.

    Please report the issue at https://github.com/WordPress/gutenberg/issues

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Gallery Block – Stacking on mobile’ is closed to new replies.