Bootstrap 4表列宽度在IE11和Microsoft Edge中无法正确格式化

Question

有没有人在使用IE11或Microsoft Edge时遇到Bootstrap 4表列格式不正确的问题？

请查看小提琴-https: //jsfiddle.net/vqazpa15/

（这在IE11 / Edge中无效，但在Firefox / Chrome中有效）

<table class="table">
    <thead>
        <tr class="row">
            <th class="col-2">column 1</th>
            <th class="col-3">column 2</th>
            <th class="col-7">column 3</th>
        </tr>
    </thead>
</table>

（这适用于我测试过的所有浏览器）

<div class="row">
    <div class="col-2">column 1</div>
    <div class="col-3">column 2</div>
    <div class="col-7">column 3</div>
</div>

小提琴有两个例子。第一个示例将内容包装在表中。第二个内容包装在div中。如您所见，这两个示例格式在Firefox和Chrome中都很好，但是在IE11和Edge中，只有'div'示例格式正确-表变得很麻烦。

有人知道发生了什么吗？

提前致谢！

Answer 1

我在Bootstrap的Github上创建了一个问题，马克说不要在表上使用和类，因为它们是Flexbox，因此会破坏表的显示属性。rowcol