我怎样才能使 flexbox parent 具有其 children 的宽度？

Question

我有一个 parent 元素，里面有两个元素：

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

目前，.parent 是 100% 宽。我希望它只是两个 children.

的宽度

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

如何使 parent 成为其内容的宽度，而不是更宽？

See codepen for a live demo.

Answer 1

将 parent 的显示从 flex 更改为 inline-flex。

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