在 IE 中使用 flexbox 没有换行符答案

【问题标题】：No line breaks using flexbox at IE在 IE 中使用 flexbox 没有换行符
【发布时间】：2016-03-16 22:03:52
【问题描述】：

当你用不同的浏览器运行这个 sn-p 时，你可以看到 IE 不应用换行符。

我忘记了什么或如何解决这个问题？

div {
  height: 200px;
  width: 200px;
  display: block;
  background-color: blue;
  color: #fff;
  padding: 10px;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  text-align: center;
}

<div>
  <h1>
  Title
  </h1>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  </p>
  <a>Button</a>
</div>

【问题讨论】：

在 IE11 上运行良好
我这里没有windows 10，所以我们说IE边缘和更低；）
实际上我无法确定哪个 css 属性正在执行此操作。我无法为 Chrome 模仿同样的问题。

标签： html css internet-explorer flexbox

【解决方案1】：

找到解决办法了..

这行简单的 css 帮助了我。

p {
  display:inline-block;
  width:100%;
}

【讨论】：

【解决方案2】：

添加“宽度：100%;”到段落

div p { width: 100%; }

你在 div 中不需要“display:block”，因为“display:flex;”覆盖这个。

而 IE 9、8 不支持 "display:flex;"

【讨论】：