Centering a div horizontally and vertically, but keeping it in place when size changes

Question

I\'m currently centering a div with some basic CSS

html,
body,
#root,
#root > div {
  height: 100%;
}

.container {
  display: flex;
  align-items: center;
  j