Home Forums Events Calendar Add-on Change calendar hours color

Change calendar hours color

Posted: June 18, 2013 at 8:17 am


June 18, 2013 at 8:17 am

On my client’s website, I have different background colors for different events, and I have the text set to white, which shows up well for the various background colors. However, the event hours color, located beneath the event title, still shows up in black.

This color is actually drawing from the regular CSS style sheet for the entire site, specifically from the p { style callout. So if I change that to white, the hours go white on my calendar but so does the rest of the p { text on the page.

I’m sure somewhere in one of the CSS files for the calendar plugin, it’s ordered to go get that color for the hours. I’m just wondering where exactly that’s called out so that I can modify it. Calendar link is:


  • Support Staff

June 18, 2013 at 8:59 am

Hi Monroe,

The nice thing about CSS is you can place additional styles to override existing ones (it’s called the Cascade, which is the C in CSS.) In this case you could add this to your theme’s custom stylesheet to make the event times display with white text:

#espresso_calendar .time-display-block span {
    color: #fff;


June 18, 2013 at 9:19 am

Thanks Josh.

I just didn’t know if there was a specific span for the time display block/what it was called. I was going to point the calendar itself to another call out, but this is a better solution.

The support post ‘Change calendar hours color’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso