dynamically add div to a container and make all same width

Question

I have a container where I want to drop other divs with dragula. The dropped divs shall all have equal width if possible (container width > sum of of min-width of the divs).

If I use flexbox this doesn't work (also other options like table or list didn't work). The first drop will have this dropped div taking 100% of the width as wanted. But after dropping the next div the first div doesn't resize and all subsequent divs will only have its min-size. Also the container is growing with each additional drop.

Here the style of my container and the children:

.container {
  width: 100%;
  display: flex;
}
.child{
  width: 100%;
  flex: 0 1 auto;
}

This is the target HTML code where the child will be dropped into (I use angular):

<div class="container" [dragula]='"bag-objects"' [dragulaModel]="container">
   <div *ngFor="let object of container" class="child>
      <objects [object]="object.object"></objects>
   </div>
</div>

I checked and tested various other solutions here on stackoverflow but none worked for me.