How can I make a flexbox parent have the width of its children?

I have a parent element, with two elements inside:

<div class="parent"><div class="child">     one</div><div class="child">    two</div></div>

Currently, the .parent is 100% wide. I would like it only to be the width of the two children.

.parent {  display: flex;  background-color: aliceblue;}

How can I make the parent to be the width of it's contents, and not wider?

See codepen for a live demo.