在I.E9

Question

以下是我的代码

HTML

<div>
    <table>
        <tr><td>Row 1</td></tr>
        <tr><td>Row 2</td></tr>
        <tr><td>Row 3</td></tr>
        <tr><td>Row 4</td></tr>
        <tr><td>Row 5</td></tr>
        <tr><td>Row 6</td></tr>
        <tr><td>Row 7</td></tr>
        <tr><td>Row 8</td></tr>
        <tr><td>Row 9</td></tr>
        <tr><td>Row 10</td></tr>
        <tr><td>Row 11</td></tr>
        <tr><td>Row 12</td></tr>
    </table>
</div>

CSS

div{
    min-width: 30px;
    max-width: 400px;
}
tr{
    display:inline-flex;
}

链接： JsFiddle

我希望水平显示表格行，如果行宽度增加div的最大宽度，它应该到达下一行。

以上代码适用于I.E 10 +和Chrome和FF。

这里的挑战不适用于I.E 9。 任何建议如何使其在IE中工作。 IE9中不支持inline-flex

我还使用了 display：table-cell 。但它没有增加div的高度