'Div with max width, in case 1 child, also in case 2 childs or 3 childs, with flex

I have a parent div, that at least contains one child. In some cases it will contain 2 children and in the last case it will contain 3 children. I would like to achieve that in all three cases the children expand to the 100% width.

Case1 Here childrenA should be width:100%

<div class="parent">
  <div class="childrenA"></div>
</div>

Case2 Here childrenA should be width:50% and childrenB should be width:50%

<div class="parent">
  <div class="childrenA"></div>
  <div class="childrenB"></div>
</div>

Case3 Here childrenA should be width:33%, childrenB should be width:33% and childrenC should be width:33%

<div class="parent">
  <div class="childrenA"></div>
  <div class="childrenB"></div>
  <div class="childrenC"></div>
</div>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source