Buttons not readable on mobile device.

[Brett Hullinger]

When viewing event calendar on mobile device, the “find out more” button looks blank (see screencast). The background color is defaulting to the same color as the text, so the user sees a blank button until they hover. Can you tell me where I change the colors/setting for these buttons?

The problem only occurs in the mobile view, not on the computer view.

http://screencast.com/t/Nk83CPaMcnDD

Thank you.

[Cliff]

Hi Brett. Thanks for the helpful screencast.

I visited your site at http://www.startwithhappy.com/events/ and determined this custom CSS should solve your problem:

@media screen and (max-width: 767px) {
#tribe-events-content a.tribe-events-read-more {
color: white;
}
}

You can add custom CSS code via your child theme’s style.css file or via a plugin like Simple Custom CSS or, my favorite, Jetpack. Jetpack supports regular CSS and the LESS and Sass pre-processors.

If you’re not a CSS expert, Jetpack’s Custom Design reference may prove helpful.

Please let me know how it goes for you.

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts