Center a div

This is my solution for challenge number 1.

My question is that when I set the style

margin: 0 auto;

margin: 0 auto;

the parent div is automatically centered horizontally .

If I do the following it centered horizontally too:

body {
  margin: 0;
  font-family: sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}

body {
  margin: 0;
  font-family: sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}

What is the difference between using the margin in the child container or the other in the body?