Why does my website shift to the left on Safari?

Screenshot of My Website on Safari

You are able to visit my website at here

This happens when I add this CSS styling:

.container {
  margin-inline: auto;
  width: min(90%, 70.5rem);
}

The reason i add this container is to restrict my contents from expanding when someone opens the website in a very large screen. This works fine with other browsers. Any help would be appreciated thank you.

Answer

MDN Web Docs: The margin-inline CSS shorthand property is a shorthand property that defines both the logical inline start and end margins of an element, which maps to physical margins depending on the element’s writing mode, directionality, and text orientation.

According to MDN web docs, Safari does not support margin-inline.

enter image description here

Try to use margin: 0 auto

For more information you can visit: https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline