explorer:使用transform:scale缩小后删除剩余的空格

时间:2013-05-26 16:15:09

标签: css internet-explorer transform scale

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

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

将被视为200%宽,即使它显示100%宽。 让我用小提琴来证明这一点:

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

我在IE10中看到水平和垂直滚动条。使用“缩放”代替具有相同的效果。

如何解释资源管理器除内容外不需要滚动条? jquery解决方案也是可以接受的。

2 个答案:

答案 0 :(得分:3)

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

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

答案 1 :(得分:0)

我更改了溢出:隐藏在#scroll和overflow:auto:on #zoomed(即基本上反转它们的溢出),使滚动功能正常 - 这是你想要的吗?虽然我有一个问题,为什么你需要有标尺,因为你可以使它看起来像你想要的CSS。