I'm having a really strange behavior. My events in SharePoint are showing out of the calendar. I searched for my CSS files to see if they were doing something to the events in Calendar, but they aren't.

I don't know what to do. What should I Do? Thanks

Sharepoint css calendar error

  • In Chrome right-click misaligned element and choose 'Inspect' from the context menu. This will show you which CSS classes and styles have been applied to the element in question. – Slaven Semper Sep 17 at 11:29
  • @SlavenSemper sharepoint applies this styles: "position: absolute; left: 1px; top: 0px; width: -4px; height: -2px;" to a class named "ms-acal-item". I don't know why. – Saul Kevin Silva Sep 17 at 11:37
  • Check whether there are errors in the console. I've checked my tenant and I get this style: "position:absolute;left:361px;top:258px;width:167px;height:41px;" for HTML element with class="ms-acal-item". – Slaven Semper Sep 17 at 11:47

To troubleshoot the issue, you could check if there is the custom code in the current page in the calendar list.

And then you also could create a new calendar list to check if the same issue will occur.

  • I created a second calendar list and the same error occur, even in different pages with different calendars to test. I will try do watch if one of my custom codes is doing something. – Saul Kevin Silva Sep 18 at 10:33


I had tag in my HTML with display:none that made SharePoint Calendar render before HTML loaded.

So, changed my tag and removed display:none SharePoint Calendar started to work.

Thanks to all.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.