Html 使用flexbox，左对齐和右对齐一行中的元素

在过去，我会使用两个容器，一个向左浮动，另一个向右浮动，使用clearfix。但我认为这种方法有点过时，因为flex功能现在得到了很好的支持

问题是，我不知道如何使用flex来布局

这是一个带有一些按钮的屏幕截图。次要动作向左对齐，其他两个主要动作应向右对齐

以下是我的标记：

<footer>
    <button>Back</button>
    <span class="primary-btns">
        <button>Cancel</button>
        <button>Go</button>
    </span>
</footer>

返回
取消
去

---

有人能告诉我这里应该使用什么CSS flex方法吗？

您可以使用

调整内容：间距


页脚{
显示器：flex；
证明内容：之间的空间；
}

返回
取消
去
在这种情况下，您甚至不需要嵌套容器

现代CSS技术（flex和grid）使这种布局变得简单，只需要一个容器


页脚{
显示器：flex；
}
按钮：第一个孩子{
右边距：自动；
}
钮扣{
保证金：5px；
}

返回
取消
去