柔性盒＆＃39; Align-self＆＃39;没有在转盘上正确对齐

Question

我正在制作一个flexbox图像轮播，我想将左右按钮放在旋转木马flexbox中，所以我将它们定位为绝对按钮。我将包装器设置为flex-flow: row所以我的直觉说当将按钮分别设置为align-self: flex-end和flex-start时，应该在flexbox的开头和结尾行 。

我快速编写了一个代码来解决这个问题：https://codepen.io/Xgr/pen/RLoWoj

关于我做错了什么的任何建议？

Answer 1

.wrapper {
  position: relative;
.btn-left {
  left: 0;
}

.btn-right {
  right: 0;
}

Answer 2

这里出现了两件事：

flex row 项目的

1. align-self设置为横轴（垂直）。

2. 由于规格的变化。对于绝对定位元素，跨浏览器存在不一致的行为。

要在弹性项目上设置时水平向左/向右对齐flex 行项目，请使用margin-left: auto / margin-right: auto，但因为这不会对ie工作IE / Safari，它们的解决方法是使用left: 0 / right: 0

Updated codepen