Styling Advanced List Widget

[Meghan Fuller]

I have used the following code to style my advanced list widget:

#top .eventsmain .tribe-events-adv-list-widget .list-date {
background: black;
color: white;
}

#top .eventsmain .tribe-events-adv-list-widget .list-date .list-dayname {
background: #d5120c;
color: white;
}

How do I change the color of the date (the number not the month/day of the week) from black to white?

Thanks so much!

[George]

Hey Meghan,

Thanks for reaching out!

These sorts of questions are unfortunately ones we cannot help with 🙁 Read more about this fact on this page ? https://theeventscalendar.com/knowledgebase/what-support-is-provided-for-license-holders/

To write 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 want to change.

As a quick example to hopefully help you get started in the right direction here, you might find that this bit of CSS helps to make the day number text white:


span.list-daynumber {
color: #fff !important;
}


I hope that helps! If not right away, tinker a bit using the tools and methods I shared above to get the CSS to apply.

Best of luck with your customizations!

George

[Meghan Fuller]

Thanks George. That little bit of help was all I needed. Thanks so much!

[George]

Awesome — best of luck with your site! 😀

— George

[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