Difference between width: 50% and flex: 50% in a CSS flexbox?

There is no effective difference in this instance.

In fact, it’s because flex is shorthand for flex-grow, flex-shrink and flex-basis combined.

flex-basis defines the default size of an element before the remaining space is distributed.

So in this case, you have defined all a children` to 50%.

Reference Article: http://css-tricks.com/snippets/css/a-guide-to-flexbox/