CSS

[Edwin]

I know it isn’t your job to teach CSS. (I actually know some HTML and CSS). But I was wondering if you could help me. On the month view, I am trying to target the following: the color of the Next and Previous month links, and the color of both the table header background and table header text color. Any chance you could help me out here? I want to style far more than this, but if you could help me figure this out, I’d probably be able to handle the rest myself. Thanks, Edwin

[George]

Hey @Edwin,

We indeed cannot help with custom coding, and I appreciate your awareness of this rule, but I can share these two CSS selectors with you and use it as an opportunity to also share a recommendation for finding them on your own.

---

Color of the Next and Previous Month Links

You can change the color of the next and previous month links with CSS like the following:


#tribe-events-footer .tribe-events-sub-nav a {
color: red !important;
}


So, #tribe-events-footer .tribe-events-sub-nav a is the selector, but you can of course use any color you want other than red 🙂

---

Color of the Table Header Background


#tribe-events .tribe-events-calendar thead th {
background: red !important;
}


---

Color of the Table Header Text


#tribe-events .tribe-events-calendar thead th {
color: red !important;
}


---

I hope these selectors help!

If you need to write more custom CSS on your site, definitely check out a [free!] tool like Firebug if you use FireFox, or the Developer Tools for either Safari or Chrome.

They have “Inspector” tools that let you zoom right over the element whose styles you would like to change, and let you find the selectors like in the examples above.

Cheers,
George

[Edwin]

Awesome! Thanks a bunch, George. That really helped.

[George]

Glad to hear it 🙂

Best of luck with your customizations!

— George

[Author]

Posts