当将诸如transform:translate(0px,-45px)之类的CSS转换添加到表行时,Internet Explorer(已测试10和11)和Microsoft Edge无法正确显示转换.
以一些简单的代码为例:
<table style="width:500px;"> <tbody> <tr style="height: 30px; background-color:red; color:white;"> <td>1</td> </tr> <tr style="height: 30px; background-color:blue; color:white;"> <td>2</td> </tr> <tr style="height: 30px; background-color:yellow; color:black; transform:translate(0,-45px);"> <td>3</td> </tr> </tbody> </table>
This screenshot显示了问题:第3行应位于第1行和第2行的顶部,但在IE / Edge中,它尚未移动.几乎任何其他现代浏览器都按预期运行. Microsoft注意到IE 10和Edge应支持(无前缀)转换,并且基于标准,支持具有显示表行的元素.
有没有人知道为什么这不起作用?
解决方法
作为
defined in the spec,transformable-elements包括其显示属性计算到表行的元素.因此,您希望转换为重新定位屏幕上的表行是正确的. Microsoft Edge似乎缺乏此支持.
但是,Edge会转换表格单元格.这暂时可以暂时缓解.我将前往work up a few tests以确保我们准确地实现此功能.
原文地址:https://www.jb51.cc/css/215100.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。