IE中没有断线(flexbox)

时间:2015-01-15 22:09:45

标签: internet-explorer text alignment flexbox

我使用以下技术在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,并与其他导航项重叠。为什么会这样?

1 个答案:

答案 0 :(得分:0)

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

很难说出你想要做的确切方法以及为什么要使用这种方法来实现这个目标但是你可能需要将flexbox放在li中的锚标签上或在div中添加一个段落标记为了得到一些你可以把宽度直接添加到div的宽度不起作用。

尝试下次提供更多代码。