Website and Online Development

Membership Committee Website & Technology
12

ISSUE: The Calendar has been broken for a while now on desktop with the whole thing skewed to the side, days of the week mushed together on the left (see image below).

image
image2560×1040 165 KB

SOLUTION
I reached to the Events Calendar support. They sent the following email/code, which I placed in: Settings > Custom Code tab > Custom CSS section

I was able to track this down to some CSS rules coming from the theme.

To override these rules, kindly append the following custom CSS code to your theme’s additional CSS section (Appearance → Customize → Additional CSS), and see if this works for you.

div.tribe-events.alignwide {
   width: 100% !important;
   max-width: 100% !important;
}

.tribe-events header {
   width: 100% !important;
}

Here’s where it went in our Bricks Builder settings:

image
image688×206 10.4 KB

And it fixed it. tribe-events are CSS classes for the calendar and !important indicates that these styles should override any other conflicting styles defined elsewhere in the CSS. So it’s not really “fixing” the root issue.