Tablesaw不适用于Safari
Tablesaw不适用于Safari
提问于 2018-07-24 07:42:46
我有一个实现表堆栈模式的表。它在Google，Mozilla，Internet，Edge上运行得很好，直到最近我才发现在Safari/iOS Safari上表的布局是扭曲的。我尝试过使用最新版本的tablesaw和Safari，但是布局仍然扭曲。
<div class="container">
<table class="tablesaw" data-tablesaw-mode="stack">
<thead>
<tr>
<th>Movie Title</th>
<th>Rank</th>
<th>Year</th>
<th><abbr title="Rotten Tomato Rating">Rating</abbr></th>
<th>Gross</th>
</tr>
</thead>
<tbody>
<tr>
<td class="title"><a href="http://en.wikipedia.org/wiki/Avatar_(2009_film)">Avatar</a></td>
<td>1</td>
<td>2009</td>
<td>83%</td>
<td>$2.7B</td>
</tr>
<tr>
<td class="title"><a href="http://en.wikipedia.org/wiki/Titanic_(1997_film)">Titanic</a></td>
<td>2</td>
<td>1997</td>
<td>88%</td>
<td>$2.1B</td>
</tr>
</tbody>
</table>
</div>关于Safari的结果：
PS:我不能使用代码片段。请点击代码链接。
更新:我发现这个布局适用于声明的<!DOCTYPE html>。但是，一旦我声明了这一点，网页就不会加载我的css内容。我试过：
- 添加type="text/css“->不工作
- 添加rel=“样式表”->不工作
- 在外部css文件中添加缺少的px/% ->不起作用
回答 1
Stack Overflow用户
发布于 2018-07-24 08:01:11
<div class="container">
<table class="tablesaw" data-tablesaw-mode="stack">
<thead>
<tr>
<th>Movie Title</th>
<th>Rank</th>
<th>Year</th>
<th><abbr title="Rotten Tomato Rating">Rating</abbr></th>
<th>Gross</th>
</tr>
</thead>
<tbody>
<tr>
<td class="title"><a href="http://en.wikipedia.org/wiki/Avatar_(2009_film)">Avatar</a></td>
<td>1</td>
<td>2009</td>
<td>83%</td>
<td>$2.7B</td>
</tr>
<tr>
<td class="title"><a href="http://en.wikipedia.org/wiki/Skyfall">Skyfall</a></td>
<td>9</td>
<td>2012</td>
<td>92%</td>
<td>$1.1B</td>
</tr>
<tr>
<td class="title"><a href="http://en.wikipedia.org/wiki/Transformers:_Age_of_Extinction">Transformers: Age of Extinction</a></td>
<td>10</td>
<td>2014</td>
<td>18%</td>
<td>$1.0B</td>
</tr>
</tbody>
</table>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51493117
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号