Reduce Space Between Events in Events List Widget

[Car McGinley]

I am trying to reduce the vertical spacing between event listings on this page (please see sidebar), but I can’t seem to ID the correct CSS selector. In looking at the Inspector in Chrome, I seem to be able to make the change I want with this code:

.tribe-mini-calendar-event event-0 last {
margin-bottom: -50px;
}

But when I apply it to my site’s CSS code, the change does not happen. I think I must have the selector wrong? Any help you can provide would be appreciated.

Thanks!
Nick

[Brian]

Hi Nick,

Thanks for using our plugin. I can help out here.

Try this:

.wpb_content_element .wpb_wrapper .hentry.type-tribe_events {
margin-top: 0;
}

Add that css to your theme’s stylesheet or through a plugin such as Simple Custom CSS.

Let me know if that helps.

Thanks

[Car McGinley]

Well, that works perfectly. I must not understand how to use Inspector very well, because I never saw any selector like that when I tried isolating the right one. Thanks for your help!

[Car McGinley]

How would I do the same thing (tighten up the vertical spacing) with the Event List module that appears in my header area (the space revealed when I click the + sign at upper right)?

Thanks!
Nick

[Brian]

Ok how about this:

.tribe-events-adv-list-widget .hentry.type-tribe_events,
.wpb_content_element .wpb_wrapper .hentry.type-tribe_events {
margin-top: 0;
}

[Car McGinley]

Nice! Thanks very much, Brian. Case closed.

[Brian]

Great glad it helps.

I am going to close this ticket, but if you need anything else related to this topic or another please post a new topic on the forum and we can help you out.

Thanks

[Author]

Posts