Steps to reproduce:
Print page below
Expected behavior:
Red square right in the middle of 500x500 px page (like rendered in all browsers with CSS transform support)
Actual behavior:
Red square half-hidden at the top, shifted to the right.
Print page below
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style>
@page {
margin:0;
size:500px 500px;
}
body {
margin:0;
padding:0;
background:#FFF;
}
div {
width:250px;
height:250px;
background:#C00;
-webkit-transform:translate(50%, 50%);
-moz-transform:translate(50%, 50%);
-ms-transform:translate(50%, 50%);
-o-transform:translate(50%, 50%);
transform:translate(50%, 50%);
}
</style>
</head>
<body>
<div></div>
</body>
</html>
Expected behavior:
Red square right in the middle of 500x500 px page (like rendered in all browsers with CSS transform support)
Actual behavior:
Red square half-hidden at the top, shifted to the right.