Menu scrolling disabled on iPhone if calendar is in background

I reloaded each of the four sites I tested, restarted the phone and each browser. This behavior persists and only happens on the calendar.

I can reproduce the behaviour.

If I put my finger in the white space area (right hand side) of the menu, directly over the hidden part of the calendar, the calendar in the background scrolls. When I move my finger above (Home / Directions) or below the calendar in the background, the menu scrolls.

If my first action on the menu is to scroll from the menu words overlying the calendar, it works as expected.

Calendar scrolling (and stretching between the days row and the first row of dates) only starts once I move over the blank part of the menu.

I did some Google research on this, and it looks like there may be some iOS historical quirks related to event handling with overlays, which is essentially what the menu is on a small screen.

BTW, I don't see this on Android. Brian uses a Pixel, and I have a Samsung Galaxy 7 phone, both Android. (Brian, I am assuming you do not see this either.)

In any case, I added a small code change, but it will only work on the Brian test website. (for now) I cannot test it since I do not use an iOS phone. Can you navigate to brian.toastmastersclubs.org , click on the reload link at the bottom (to make sure you get the modification), and see if my modified code makes any difference.

Since we do not have the luxury of having a lot of devices to test, we really have limited ability to address some quirks like this.

No change, except the calendar boxes don't seem to stretch any more. It only happens in portrait mode (no overlay in landscape mode).

Ok, I am not sure what to do... I will keep looking for a solution. It seems system/browser specific.

I did some more research and added some more modifications... Can you check it now? (brian test website only)