Html 如何将弹性项向右对齐？

我想把红色按钮放在右边，就像我过去使用浮点数一样

小提琴：

.container{
身高：100%；
宽度：100%；
背景颜色：黄色；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
李先生{
列表样式：无；
填充：0px；
}
#名单{
宽度：300px；
背景：灰色；
}
.项目{
显示器：flex；
对齐项目：居中；
调整内容：灵活启动；
}
.破坏按钮{
背景：红色；
证明内容：柔性端；
}

标题
毁灭


第二名
毁灭


第三名
毁灭

添加此样式：

.destory-button {
  margin-left: auto;
}

参考：

.container{
身高：100%；
宽度：100%；
背景颜色：黄色；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
李先生{
列表样式：无；
填充：0px；
}
#名单{
宽度：300px；
背景：灰色；
}
.项目{
显示器：flex；
对齐项目：居中；
调整内容：灵活启动；
}
.破坏按钮{
背景：红色；
证明内容：柔性端；
左边距：自动；
}

标题
毁灭


第二名
毁灭


第三名
毁灭

@ManojKumar，

align self:flex end

作用于横轴（在本例中为垂直面）。主轴需要类似于

justify self:flex end

的东西，它不存在，但是

auto

边距是一个很好的替代品。明白了，谢谢。当横轴现在为水平面时，当

弯曲方向

设置为

列

时，它工作。我想我在这里偶然发现了你的问题：值得在这里加上评论。由于演示代码具有不同的属性，因此必须删除我的上述注释。可能重复的