[Resolved] Gutenberg Image gallery – mobile

Home Forums Support [Resolved] Gutenberg Image gallery – mobile

Home Forums Support Gutenberg Image gallery – mobile

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1568233
    Vera

    Hi,
    I use a three-column Gutenberg image gallery that I would like to turn into a one-column image gallery on mobile. I added the following CSS:

    @media
    (max-width: 768px) {
    .wp-block-gallery .blocks-gallery-grid li.blocks-gallery-item {
    width: 100%;
    }
    }

    And this works fine, except that for some reason, on mobile, every second image is smaller than the previous or following image. Can you please have a look and help me fix this?
    Thanks in advance!
    vera

    #1568361
    David
    Staff
    Customer Support

    Hi there,

    try updating your CSS to this:

    @media (max-width: 768px) {
        .wp-block-gallery .blocks-gallery-grid li.blocks-gallery-item {
            width: 100%;
            margin: 0 0 16px;
        }
    }
    #1569029
    Vera

    Works like a charm! Thanks so much, David!

    #1569151
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.