HTML – 移动表崩溃IE9

2019年8月3日 154次阅读

因此,我将头发拉出IE9错误导致浏览器崩溃.我有一张桌子,我正在使用媒体查询重新格式化小屏幕设备.这是一些非常漂亮的编码,但在IE9中,当我重新缩放浏览器窗口大于媒体查询时,它会崩溃IE9.当你尝试将CS​​S从它中取出时似乎可以这样做但是在添加它时可能不会这样做吗？

我发布了我的源码code here.尝试在IE9中重新调整它.

我更新了我的来源并将其缩小到what is causing the problem.

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到TABLE标记.我真的不想浮动桌子,所以我会继续寻找其他修复.

点赞