当父级具有 flex-flow: column wrap;答案

【问题标题】：Element is not horizontally centered in IE11 with Flexbox when parent has flex-flow: column wrap;当父级具有 flex-flow: column wrap;
【发布时间】：2015-09-29 23:48:27
【问题描述】：

JSFiddle Link

.thing {
	background-color: tomato;
	max-width: 300px;
	padding: 30px;
	display: flex;
	margin: 0 auto;
	flex-flow: column wrap;
}

.not-centered {
	max-width: 150px;
	background-color: #fefefe;
	margin: 0 auto;
}

<div class="thing">
	<div class="not-centered">
		im not centeredi in ie11
	</div>
</div>

我认为它可以工作，因为如果设置了 max-width 和 margin: 0 auto。但正如你所看到的，它不是水平居中的，因为他的父母.thing 有flex-flow: column wrap。

有什么想法可以在这个设置中解决这个问题吗？

P.S.在 Chrome/FF 中工作

【问题讨论】：

好吧。我只是将它包裹在div 中，并且它起作用了。 Jesus IE11 的 Flexbox 实现是纯粹的垃圾 =/
请将其作为答案发布并接受，以便该问题的未来读者受益！
如果你刚刚起飞，它应该以IE11为中心flex-flow: column wrap;

标签： css internet-explorer-11 flexbox

【解决方案1】：

用block 显示将.not-centered 包装在div 中可解决IE11 中的问题

【讨论】：