如何将div holder与viewport和其他div对齐？

Question

我不知道如何实现以下目标。我有一个部分可容纳3张图片。那些图像将在该部分中响应。我想将持有人div对齐到视口的左侧，将持有者div的右侧对齐到容器div。见图：

我的标记如下所示：

<section>
    <figure>
        <img src="http://placehold.it/400x210">
    </figure>
    <figure>
        <img src="http://placehold.it/400x210">
    </figure>
    <figure>
        <img src="http://placehold.it/400x210">
    </figure>
</section>

这只能用css吗？

CodePen：https://codepen.io/anon/pen/bWWyJN

Answer 1

您是否尝试过使用flexbox？将display: flex; flex-direction: row;放在您的容器上，flex: 1 1 auto;放在您的孩子身上。 （对于IE来说，这应该是一个足够简单的例子。）