Divide container in equally sized divs

Let's imagine a container with three divs as content:

<div class="container">
  <div>1</div>
  <div>2</div>
  <div>Looooooooooooong</div>
</div>

One might want to lay the three divs horizontally and make it so that all divs share the available space equally. This can be achieved using flexbox:

.container {
  display: flex;
}

.container div{
  /* take all available space */
  flex-grow: 1;
	
  /* Insensitivity to size of content */
  /* If not set, the div containing "looong" will take more space */
  flex-basis: 0;
}

Here, if flex-basis was not set the div containing looooong would get more horizontal space