I tried to center the div by using this way: div height is : 35.3em margin-top : calc(50% - (35.3em / 2))
The bug happens when i play with the width of the browser, The div somehow change his horizontal position
The URL of my site : http://cherry-rocks.herokuapp.com
Seeing as you use relative positioning, you can also use top instead of margin-top to explicitly position the element to the center. Use top: calc(50% - (35.3em / 2)) instead of margin-top or display: flex on the parent and margin: auto on the child, if you are willing to use flexbox.