Flex box container width doesn't grow [duplicate]

Answer 1

I think this is the CSS you're looking for:

#container {
  display: flex;
  flex-flow: row wrap;
  border: 1px solid #f00;
  padding: 1px;
}

#container > * {
  border: 1px solid #555;
  background-color: #ccc;
  height: 200px;
  width: 200px;
  margin: 1px;
}

The "Container" will always the the width of it's container, in this case the page, but now the boxes will adjust within it properly.

Let me know if I misunderstood your question.

Update

I've been playing with what you're asking for for several days now, and it really seems like it's not possible to do what you're asking... at least not in the direction that you're asking.

The container wants to be the maximum width possible. Unless you force the container to be the exact width, at which point it wont be the full width, but it wont flex with the flexing content either.