Photos stretching on mobile

I have inserted a few galleries onto a photo page which look completely normal on the desktop version but stretch on the mobile version. Any idea how to prevent this?

Hey Emily,

Could you please share your Website URL with us so we could have a better look at your issue? You can use the private reply option below.

Thanks!

KC

[Content Hidden]

Hey Emily,

Just took a look at your Website and it looks like you’re using a text editor with a gallery shortcode in it. Am I right? I was wondering, have you seen the “Content Pages” template called “Team”? It is available inside the BB page builder Templates section. What I’m trying to show you is how it is built. It is fully compatible with responsive screens and with enough options to produce the result similar to what you’ve done.

If you do not wish to change it, just use the CSS snippet below to fix the responsive issue there.

@media only screen and (max-width: 800px) {
.fl-module-content #gallery-1 .gallery-item,
.fl-module-content #gallery-2 .gallery-item,
.fl-module-content #gallery-3 .gallery-item,
.fl-module-content #gallery-4 .gallery-item,
.fl-module-content #gallery-5 .gallery-item,
.fl-module-content #gallery-6 .gallery-item{
    width: 50%;
}
.fl-module-content #gallery-7 .gallery-item{
    width: 100%;
}
}

@media only screen and (max-width: 360px) {
.fl-module-content #gallery-1 .gallery-item,
.fl-module-content #gallery-2 .gallery-item,
.fl-module-content #gallery-3 .gallery-item,
.fl-module-content #gallery-4 .gallery-item,
.fl-module-content #gallery-5 .gallery-item,
.fl-module-content #gallery-6 .gallery-item,
.fl-module-content #gallery-7 .gallery-item{
    width: 100%;
}
}

Not really getting your second question regarding the captions, could you elaborate?

Thanks!

KC

Ooh, I didn’t know about that template. I think that will solve both problems. Thank you!

Hey Emily,

Just let us know if you need anything further! :slight_smile:

Thanks!

KC