title: some problem when responsive a html css file, the item file display irregularly and when responsive, item file does not display in full screen
body: <p>I am a newbie with html css and here is my problem.</p>
  <p>I made a very simple html css file and here is my code</p>
  <p><a href="https://github.com/anhbui2904/example21" rel="nofollow noreferrer">https://github.com/anhbui2904/example21</a></p>
  <p>And I have some questions, the first problem is, why at full screen, the box is in the middle of the screen, not at the left hand, even if I use at the .grid.wide as <code>justify-content: left;</code>?</p>
  <p>My second problem is, why all 5 boxes at the right are not in the same line with the left box?</p>
  <p>My third problem is, why when I change the code</p>
  <pre><code>.row {
      margin-left: -12px;
      margin-right: -12px;
  }
  </code></pre>
  <p>to</p>
  <pre><code>.row {
      margin-left: -6px;
      margin-right: -6px;
  }
  </code></pre>
  <p>the distance between columns does not decrease?</p>
  <p>Could you please help me with those problems? Thank you very much for your time.</p>