使用-webkit-transform时不需要左边距：scale(…)

我使用wkhtmltopdf(使用Webkit渲染引擎)将 HTML文件转换为PDF文档.生成的PDF是A4.换句话说,它们具有固定的尺寸,因此具有有限的宽度.

我的PDF中的表格之一包含图像,这些图像以拼图方式错综复杂地拼接在一起,有时占据很大的空间.

为了在A4 PDF的约束条件下适应所产生的难题,我正在应用CSS属性-webkit-transform：scale(…);

这样巧妙地缩放拼图,并且仍然清晰易读,但由于某种原因,它也将包含谜题的表格向右推.尽管我明确地将其左边距设置为0,但它似乎在拼图的左侧增加了显着的余量.

有趣的是,我的webkit转换规模越小,左边的边距就越大.所以例如,如果我使用scale(0.75),所得的左边距大约是200像素.如果我使用缩放(0.5),则左边距约为400像素.

我已经尝试使用绝对的,固定的和相对定位的左对齐拼图：左：0.我也尝试将其浮动到左边,以及将其粘贴到一个容器中,将text-align设置为left.这些技术都没有工作.

任何这个左边距来自哪里的想法,以及我如何去除它/解决它？

解决方法

经过一番尝试和错误之后,将以下CSS代码添加到了拼图表中：

-webkit-transform-origin-x: 0;

更多关于这个房产的信息：http://css-infos.net/property/-webkit-transform-origin-x

更新：有关跨浏览器支持,请参阅Richar-dW的评论.

原文地址：https://www.jb51.cc/css/214178.html