Site logo

Archived topic

Event Calendar widget

5 replies · Started by Hans on September 30, 2021

Viewing posts 1–6 of 6

I use my blog page with three columns and a right sidebar. The widget in the sidebar is the event list of 'Event Calendar' plugin. The <article> of this widget is divided into three parts as my blog part.

How to avoid this confict?

Hi there,

try adding this CSS:

.sidebar .tribe-events-widget-events-list__events .tribe-events-widget-events-list__event {
    width: auto;
}

Unfortunately your proposed solution doesn't work. This CSS still limits the width to 33%.

<article class="tribe-events-widget-events-list__event post-15983 tribe_events type-tribe_events status-publish has-post-thumbnail hentry tag-ausstellungen tribe_events_cat-sakrala infinite-scroll-item masonry-post generate-columns tablet-grid-50 mobile-grid-100 grid-parent grid-33 no-featured-image-padding resize-featured-image">

The page is generated with WP Show Posts. Entering "width: 100%;" in the developer tools on the element level of the code above everything works fine. But I am not able to find the correct definition for the CSS.

It seems to be a problem of WP Show Posts - on all other pages the widget works!

Hi Hans,

It's happening because this element is using grid-33class which is the same as what your Blog columns are using, so the CSS of theme columns kicked in.

Try this CSS:

.inside-right-sidebar .tribe-events-widget-events-list .generate-columns.grid-33 {
    width: auto;
}

Let me know :)

This also didn't work. But I made a mistake. The error occured on the blog page. On the page using WP Show Posts everything is okay. Thus I now use this page as a roundup.

If you can leave the CSS on your site then we can have a look if it's been overridden by other CSS.

But it's ok, as long as it works for you :)

This archived topic is closed to new replies.