移动表崩溃IE9

问题描述

| 因此，我正在努力解决导致浏览器崩溃的IE9错误。我有一张要重新格式化的表格，用于使用媒体查询的小屏幕设备。这是一些非常漂亮的编码，但是在IE9中，当我重新缩放浏览器窗口的大小大于媒体查询时，它使IE9崩溃。尝试从CSS上拿走CSS而不是添加它时似乎做到了？ 我在这里发布了我的源代码。尝试在IE9中重新缩放。 我更新了源代码并将其范围缩小到导致问题的原因。 HTML ...

<table width=\"100%\">
<thead>
<tr>
<th><a href=\"#\">Detail 1</a></th>
<th><a href=\"#\">Detail 2</a></th>
<th><a href=\"#\">Detail 3</a></th>
</tr>
</thead>
<tbody>
<tr>
<td data-label=\"Detail 1: \">Detail 1 Here</td>
<td data-label=\"Detail 2: \">Detail 2 Here</td>
<td data-label=\"Detail 3: \">Detail 3 Here</td>
</tr>
<tr>
<td data-label=\"Detail 1: \">Detail 1 Here</td>
<td data-label=\"Detail 2: \">Detail 2 Here</td>
<td data-label=\"Detail 3: \">Detail 3 Here</td>
</tr>
<tr>
<td data-label=\"Detail 1: \">Detail 1 Here</td>
<td data-label=\"Detail 2: \">Detail 2 Here</td>
<td data-label=\"Detail 3: \">Detail 3 Here</td>
</tr>
</tbody>
</table>

CSS ...

@media only screen and (max-width: 800px) {
TABLE TBODY {float:left}
TABLE TBODY TR {float:left}
TABLE TD {float:left}
TABLE TD:Before {float:left;content:attr(data-label)}
}

    

解决方法

        好的，一种解决方法似乎是在表标签中添加float：left。我并不是很想浮动表，所以我将继续寻找其他修复程序。