internet-explorer - IE 中不换行(flexbox)

Question

我使用以下技术将文本在 DIV 中垂直居中:

.nav-wrap>ul>li>a div{
    height: 100%;
    display: flex;
    justify-content: center;
    align-content:center;
}

它用于导航菜单，其中一个项目如下所示(位于 UL 中的 LI 项目内):

<a href="#" data-dropdown="training"><div>Online Training/Resources</div></a>

但是，垂直对齐在 中工作正常，但在 IE11(可能还有旧版本)中遇到问题。在 Chrome 和 Firefox 中，如果文本行比容器的宽度长，它会分成两行，并保持对齐，就像它应该的那样。但在 IE 中，它不会中断，它会扩展到 div 之外，并与其他导航项重叠。为什么会发生这种情况？

Answer 1

您需要为 Flexbox 内部的元素添加宽度。

很难说出您正在尝试执行的确切方法以及为什么使用此方法来实现该目标，但您可能需要将 Flexbox 放置在 li 中的 anchor 标记上或在 div 中添加段落标记为了拥有一些可以放置宽度的东西，直接向 div 添加宽度是行不通的。

下次尝试提供更多代码。