Flex-wrap:Edge中的wrap-reverse

时间:2017-04-07 06:48:13

标签: html css css3 flexbox microsoft-edge

在以下示例中,flex项从包装器的右上角开始流动:



div {
  outline: 1px solid teal;
}

#wrap {
  width: 400px;
  height: 200px;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap-reverse;
}

#wrap div {
  width: 50px;
  height: 50px;
}

<div id="wrap">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</div>
&#13;
&#13;
&#13;

但这就是我在Edge中看到它们的方式:

enter image description here

使用flex-direction: row;,它们看起来像这样:

enter image description here

但这就是他们在Edge中的样子:

enter image description here

Edge是否正常运行?

1 个答案:

答案 0 :(得分:1)

Edge在2016年4月的版本中似乎有this bug

在报告中(2017年3月29日),从版本15063开始,此错误已得到修复。

旁注:看来固定版仅作为内幕预览发布,但本月(2017年4月)发布的创作者更新,都应该得到它