Style of event titles in list view

[Robert]

The appearance of my calendar views is modified in the CSS file in the child theme on my site. We have successfully used the code below to modify the event descriptions. However when I try to use similar code to modify the font-size of the event titles, I can’t get it to work. Could you possibly suggest the correct coding to achieve this? I’d be most grateful! I would also like to minimise the white space between event entries in list view.

.tribe-events-list-event-description p {font-size:13px !important;}
#tribe-events .tribe-events-content p, .tribe-events-before-html p, .tribe-events-after-html p {
}

[Cliff]

Hi Robert.

Could you please provide a link where I can see the page you’re trying to modify — and also provide an annotated screenshot of exactly what item you’re wanting to have modified?

Thank you.

[Robert]

Hi Cliff,
Thanks for your interest.
Here is a link to our list of events: http://menorah.org.uk/calendar/list/
It’s the main listing in the central column that I am concerned about. I want to reduce the size of the event titles, and also to reduce the space between event items.

[Cliff]

Robert, this should do it for you:

body.post-type-archive-tribe_events.events-list .tribe-events-list .type-tribe_events h2 {
font-size: 1.2em;
}
body.post-type-archive-tribe_events.events-list .tribe-events-list .type-tribe_events {
padding-top: 1em;
padding-bottom: 1em;
}

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.

[Robert]

Just perfect! Many thanks.

[Cliff]

That’s what I like to hear! Thanks 🙂

[Author]

Posts