Photo view not rendering properly on mobile

[Rick Quatrone]

Hi there. On photo view there is a big space next to the photo. For some reason the photo does not fill in the whole row or the calendar is not centering the image. This only appears when the website renders on a mobile device/smaller screen size. It renders fine on desktop. Is there any way to fix this?

[Rick Quatrone]

Here is a link to the website http://a74.405.myftpupload.com/

[Geoff]

Hey Rick,

Thanks for getting in touch! I love that your venue is hosting Snoop Dogg — that’s awesome. 🙂

Will you please try adding this CSS snippet to your theme’s style.css file or on the Appearance > Customize > Additional CSS screen?

.tribe-events-list .tribe-events-event-image {
width: 100%;
}

Here’s a screenshot of how that looks when I tested it out on your site. does it do the trick for you as well? Please let me know.

Cheers!
Geoff

[Rick Quatrone]

Hi Geoff,

Thanks for replying!! We were really excited for Snoop Dogg!

I added the CSS and it didn’t work. The css didn’t change it for photo view on the home page or list view on the events page.

To clarify I only need to fix the issue on photo view. It was like that before I did any customizations. I am still customizing list view

[Rick Quatrone]

I forgot to mention the image became 100% when it was in desktop view, but on a mobile device it wasn’t 100%

[Geoff]

 

Hey Rick,

Thanks for following up!

Will you please try adding this CSS to the mix?

.tribe-events-list .tribe-events-event-image img {
width: 100% !important;
}

Even though the CSS looks like it’s scoped to the List View, that’s what Photo View uses in small screens. 🙂

It’s worth noting that the events on the homepage look like a custom widget or feed — so you may need to write something else in order for the change to take effect there as well.

Cheers!
Geoff

[Rick Quatrone]

Geoff it worked!! Thank you very much for the help!

Have a Happy New Year!

Rick

[Rick Quatrone]

Resloved

[Geoff]

Right on! I’m so glad to hear everything is working smoothly and I appreciate you following up to let us know. Definitely keep us posted if any other questions come up and we’d be happy to help. 🙂

Cheers and happy new year to you as well!

Geoff

[Author]

Posts