Lề trái không mong muốn khi sử dụng -webkit-transform: scale (...)

Question

Tôi đang sử dụng wkhtmltopdf (sử dụng công cụ kết xuất Webkit) để chuyển đổi các tệp HTML sang tài liệu PDF. Các tệp PDF được tạo là A4. Nói cách khác, chúng có kích thước cố định và do đó có chiều rộng giới hạn.

Một trong các bảng trong tệp PDF của tôi chứa hình ảnh được ghép nối phức tạp với nhau theo kiểu câu đố và đôi khi chiếm rất nhiều chỗ.

Để phù hợp với câu đố kết quả trong các ràng buộc của PDF A4, tôi đang áp dụng thuộc tính CSS -webkit-transform: scale (...);

Điều này quy mô các câu đố đẹp, và nó vẫn còn rõ ràng dễ đọc, nhưng đối với một số lý do nó cũng đẩy bảng chứa các câu đố bên phải. Dường như thêm một lề quan trọng vào bên trái của bảng câu đố, mặc dù tôi đã đặt lề trái của nó một cách rõ ràng thành 0.

Điều thú vị hơn, quy mô nhỏ hơn trong phép chuyển đổi webkit của tôi, lề lớn hơn bên trái. Vì vậy, ví dụ, nếu tôi sử dụng tỷ lệ (0,75) lề trái kết quả là khoảng 200 pixel. Nếu tôi sử dụng tỷ lệ (0,5), lề trái kết quả là khoảng 400 pixel.

Tôi đã cố gắng căn chỉnh bảng câu đố ở bên trái bằng cách sử dụng vị trí tuyệt đối, cố định và tương đối bằng trái: 0. Tôi cũng đã cố gắng thả nó sang bên trái, cũng như gắn nó vào một vùng chứa có căn chỉnh văn bản đặt sang trái. Không có kỹ thuật nào trong số này hoạt động.

Bất kỳ ý tưởng nào về lề trái này đến từ đâu và cách tôi có thể xóa nó/làm việc xung quanh nó?

Answer 1

Sau một chút thử và sai, thêm mã CSS sau vào bảng câu đố đã làm các trick:

-webkit-transform-origin-x: 0; 

Thông tin thêm về khách sạn này có sẵn ở đây: http://css-infos.net/property/-webkit-transform-origin-x

UPDATE: thấy Richar- Nhận xét của dW bên dưới để hỗ trợ trình duyệt chéo.