What does margin auto mean?

Question

I checked MDN to see what means to have an auto value for margin property and it says: \"auto is replaced by some suitable value, e.g. it can be used for centering

Answer 1

Auto margins

Depending upon the circumstances, provision of an auto value instructs the browser to render a margin according to the value provided in its own stylesheet. However, when such a margin is applied to an element with a meaningful width, an auto margin instead causes all of the available space to be rendered as whitespace.

From w3.org

Answer 2

#main {
  width: 600px;
  margin: 0 auto; 
}

<div id="main"> Setting the width of a block-level element will prevent it from stretching out to the edges of its container to the left and right. Then, you can set the left and right margins to auto to horizontally center that element within its container. The element will take up the width you specify, then the remaining space will be split evenly between the two margins.</div>