最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

How Do I Prevent An Image From Automatically Adjusting In Guttenberg Block Gallery?

programmeradmin2浏览0评论

I am trying to implement a Gutenberg gallery with 10 images with a 4 column gallery. The first two rows coming fine with 4 column images each row. But the issue is that the last row, which has 2 images are adjusting itself to accommodate the full length of the gallery (as shown in the picture below). Is there any way to prevent that by writing some code? Please let me know. Thanks.

I am trying to implement a Gutenberg gallery with 10 images with a 4 column gallery. The first two rows coming fine with 4 column images each row. But the issue is that the last row, which has 2 images are adjusting itself to accommodate the full length of the gallery (as shown in the picture below). Is there any way to prevent that by writing some code? Please let me know. Thanks.

Share Improve this question edited Aug 14, 2020 at 23:54 Faye 6815 silver badges16 bronze badges asked Aug 14, 2020 at 9:02 MACMANMACMAN 1011 bronze badge
Add a comment  | 

1 Answer 1

Reset to default 1

Gutenberg is applying a flex-grow: 1; to the items, which allow it to fill the space. You override this by pasting the following into your css.

.blocks-gallery-grid .blocks-gallery-image, 
.blocks-gallery-grid .blocks-gallery-item, 
.wp-block-gallery .blocks-gallery-image, 
.wp-block-gallery .blocks-gallery-item {
   flex-grow: 0;
}

Ideally, you do this in your theme, but if you urgently need this up, or if you are unfamiliar with WordPress development, then you can add this to your customizer "Additional CSS" tab.

发布评论

评论列表(0)

  1. 暂无评论