Month with Sidebar and Year with Sidebar out of alignment

[Shauna Maughan]

When I create a calendar using the Month with Sidebar, the month selector is forcing the calendar away from the sidebar and causing the dates to be squished into smaller columns due to a large gap. (same behavior applies on your own “Preview Your Calendar” feature on your website). When I use the Year with Sidebar, the month selector forces the third month down into the second row instead of it keeping it together on the first row. (Your “Preview Your Calendar” feature on your website does not have this behavior). If I select the Compact Month Navigation Style, it fixes the problem on the month view, but my arrows are jumping forward 4 months instead of just one.

[room34]

Would it be possible to get the URL of your calendar page so I can have a look? Thanks.

[room34]

Update: After some investigation, I’ve determined this issue with the Month with Sidebar dropdown causing the extra wide margin on the month table was introduced with a CSS change in version 4.6.0. This CSS change should only be applied at the mobile breakpoint.

This issue has been fixed in the code base and will appear in the next ICS Calendar Pro update.

[Shauna Maughan]

Great News on the Month with Side Bar – We are really loving the layout of that one. Thanks for the amazingly quick response. Here is the URL for the Year with Sidebar that is forcing the third month down to the second row: https://af.americanheritageschool.org/calendar/#tab-id-5

[Shauna Maughan]

This is the URL for the calendar that is jumping 4 months when you use the arrow to advance to the next month: https://af.americanheritageschool.org/calendar/#tab-id-4

[room34]

Hmm… that multi-month jump is a weird one. I’m not able to duplicate that on my test site. I’ll have to investigate further.

Have you tried the “Both” or “Arrows” options for Month Navigation Style? I’m wondering if the problem is affecting the previous/next month links on your site for all of the options, or only “Compact”.

[room34]

I’ve determined that this issue is due to the calendars being loaded via AJAX. Multiple AJAX calendars loading on one page is causing the ICS Calendar initialization function to run multiple times. That in turn is causing the logic that runs when you click these links to fire off multiple times on each click.

I should be able to get a fix for this added to this week’s update (scheduled to roll out on Friday), but in the meantime you should be able to work around it by turning off the AJAX loading. (Note that this might make your calendar page load noticeably slower; if that’s the case, you’ll want to switch back to using AJAX after the update is available.)

[room34]

I have a working fix for this in place now in development, which will be released with the next update on Friday.

[Author]

Posts