Archived topic
Image gallery not stretched out to full width
6 replies · Started by Brett on September 7, 2021
Hi.
I have created a blog post containing a few blocks of text, image galleries and videos. In one container there is a two-column-gallery with one image loaded from the media library and one animated gif loaded from vimeo. This one is stretching out full width. A bit further down the post I created another two-column-gallery with the same setup, an image and an animated gif. But this one is not stretching out to full width. I've tried a few tricks but I can't figure out why they differ. The one that is not stretching can be found in this test post, before the yellow section with the text "Check out the end result". https://brokendoll.com/test-planetfall-invasions/
Any ideas?
Thanks in advance.
Hi Brett,
Are you referring to this one here?
https://www.screencast.com/t/GPtsLC1Q
Looks like the issue because the inner container of the container block from GP is set to contained:
https://docs.generateblocks.com/article/container-overview/#inner-container
Also just a note that since you are already using GB, I'd recommend replacing all the columns block (from WP core) with Grid block from GP:
https://docs.generateblocks.com/article/grid-overview/
Let me know if this helps :)
Hi Brett,
Are you referring to this one here?
https://www.screencast.com/t/GPtsLC1Q
Looks like the issue because the inner container of the container block from GP is set to contained:
https://docs.generateblocks.com/article/container-overview/#inner-container
Also just a note that since you are already using GB, I'd recommend replacing all the columns block (from WP core) with Grid block from GP:
https://docs.generateblocks.com/article/grid-overview/
Let me know if this helps :)
Hi. Thanks for quick response.
No I was actually referring to the section above the yellow section where it says "Check out the end result". Here's a screenshot where you can see the difference between 2 still images and one still plus one gif.
https://www.dropbox.com/s/ffmip1h2lg0vvcb/Skarmavbild%202021-09-08%20kl.%2015.20.41.png?dl=0
Hi there,
try adding this CSS:
.wp-block-gallery .blocks-gallery-grid {
width: 100% !important;
}Oh! Works great. Thank you!
Glad to hear that!
