Archived topic
Event Calendar widget
5 replies · Started by Hans on September 30, 2021
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 :)