Default stylesheet – Poor Mobile Layouts

[Darren]

HI,

Looks great on a desktop but disappointing when viewed on a tablet or phone?

I have tried all styles but cannot get the image to stretch to the full width when viewed on a tablet or phone.

Is there a simple fix?

[Trisha]

Hello Darren!

Thanks for getting in touch! Fortunately this is a pretty simple fix.

Log in to your site and from the front end you’ll see the ‘Customize‘ button in the top admin bar. Click that and the Customizer will open. At the bottom of the list of items you’ll find ‘Additional CSS‘. Click that and in the box that opens paste the following code:

/* The Events Calendar Custom CSS Snippet */
@media screen and ( max-width: 768px ) {
.tribe-events-list .tribe-events-event-image img {
width: 100%;
height: auto;
}
}

I hope that helps! Thanks again, and let me know if there’s anything else I can do, I’m happy to help!
?

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts