在 Internet Explorer 10 中,在这种情况下我遇到了 flexbox 的问题:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10" />
</head>
<body>
<div style="width: 500px; background-color: grey;">
<table>
<tbody>
<tr>
<td>
<div style="display: flex; display: -ms-flexbox;">
<span style="display: inline-block; max-width: 100%;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc lacus dui, volutpat vel venenatis at, facilisis non sem. Maecenas eu tempus erat. Maecenas malesuada non orci ut dapibus. Curabitur venenatis eget diam ut mollis.</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
“文本很长”超出了灰色的div。在其他浏览器中它可以工作。同样在 Internet Explorer 11 中。现在我插入元数据来设置 Internet Explorer 10 兼容性。
更新: 我用你的更正更新了代码,但它在我的情况下还不起作用。
最佳答案
看起来 max-width
或 width
也是需要的。 http://codepen.io/anon/pen/wGgWWW
免责声明:仅通过开发工具进行测试,不是真正的 IE10
.a{
display: flex;
width:50%;
background:red;
}
span {
display:inline-block;
max-width:100%;
}
<div style="width: 50%; background-color: grey;">
<div class="a" >
<span >Text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long very long text very long text very long text very long text very long text very long text very long</span>
</div>
</div>
EDIT 来自有问题的代码编辑。
一张 table 包裹着 flex 容器。
表格根据内容展开,如果 table-layout:fixed;
设置了 width
,则 flex 容器应该站在里面,child 应该包裹内联内容。 http://codepen.io/anon/pen/oxBeoz
table {
table-layout:fixed;
width:100%;
}
<div style="width: 500px; background-color: grey;">
<table>
<tbody>
<tr>
<td>
<div style="display: flex; display: -ms-flexbox;">
<span style="display: inline-block; max-width: 100%;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc lacus duploplopoloppl i, volutpat vel venenatis at, facilisis non sem. Maecenas eu tempus erat. Maecenas malesuada non orci ut dapibus. Curabitur venenatis eget diam ut mollis.</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
关于css - Internet Explorer 10 中的错误,表中有 flexbox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36046627/