title: What does margin auto mean?
body: <p>I checked <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/margin" rel="noreferrer">MDN</a> to see what means to have an auto value for margin property and it says: "auto is <em>replaced by some suitable value</em>, e.g. it can be used for centering of blocks."</p>
  
  <p>But what it is that suitable value, and suitable for what?</p>
  
  <p>I tried myself some experiments and I saw that if I add <strong>margin-left: auto</strong>, the container goes to right (like is floating to right):</p>
  
  <pre><code>#container {
      background: red;
      width: 120px;
      margin-left: auto;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/sph2j6jx/" rel="noreferrer">http://jsfiddle.net/sph2j6jx/</a></p>
  
  <p>Does it mean that adding margin auto is actually something like "take all the space available"? And when you add both left and right margins it centers the div because it tries to take all the space from left and from right?</p>