Como faço para fazer a caixa verde (.b) apertado ao redor do conteúdo para que eu possa centralizá-lo horizontalmente?

.c {
  background-color: blue;
  margin: 5px;
  height: 100px;
  display: inline-block;
}

.a {
  border: 1px solid red;
}

.b {
  margin: 0 auto;
  border: 1px solid green;
}

body {
  padding: 50px;
}

<div class="a">
  <div class="b">
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="c">
      <table>
        <tbody>
          <tr>
            <td>x x x x x</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>

Esclarecer: