资源管理器:使用transform:scale删除缩小后的剩余空白



这很难解释…如果您使用css缩放(和缩放)来缩小(小于1),在资源管理器9和10中,周围元素仍然将其内容区域视为其原始大小。例如

   transform:scale(0.5);
   width:200%;

将被视为200%宽,即使它显示为100%宽。让我用小提琴演示一下:

http://jsfiddle.net/pike/CAbcH/

我在IE10中看到水平和垂直滚动条。使用"变焦"也有同样的效果。

我如何解释浏览器在内容之外不需要滚动条?jquery解决方案也是可以接受的。

这里有一个解决方案- http://jsfiddle.net/pike/YmfGC/

不是那么整洁,使用浏览器嗅探,它基本上是在缩放的div周围写一个包装<div>,仅适用于IE,使用浏览器在渲染页面后发现的width()和height()…

我改变了overflow:hidden (#scroll)和overflow:auto: on #zoom(即基本上逆转了他们的溢出),使卷轴的功能,因为他们应该-这是你想要的吗?虽然我有一个问题,为什么你需要有尺度,因为你可以让它看起来就像你想要的css。

最新更新