Fit div width to inline-block children

Question

I want the container div (#a-container in this example) to fit the width of its children, that are inline-block divs. In this example, I want the #a-container d

Answer 1

Here's a fiddle that uses display: table and floating: http://jsfiddle.net/vqjnoqur/.

HTML:

#a-container {
  display: table;
  background-color: gray;
}

.a {
  background-color:blue;
  width:100px;
  height: 100px;
  margin: 5px;
  float: left;
}

.a:nth-of-type(2n + 1) {
    clear: left;
}

<div id="a-container">
  <div class="a"></div>
  <div class="a"></div>
  <div class="a"></div>
  <div class="a"></div>
  <div class="a"></div>
  <div class="a"></div>
  <div class="a"></div>
</div>