#15466: Webkit: CSS rotation produces wrong result
---------------------------+----------------------------
Reporter: WildKeccak | Owner: pulkomandy
Type: bug | Status: new
Priority: normal | Milestone: Unscheduled
Component: Kits/Web Kit | Version: R1/Development
Resolution: | Keywords:
Blocked By: | Blocking: 15479
Platform: x86-64 |
---------------------------+----------------------------
Comment (by nephele):
I made a simpler test using a file from the artwork:
As you can see in this page the rotated image is about one image too high
(it should be on the second "line" but it is above the first one)
And if you scroll down the page the images move to the right, instead of
to the top how they should (as in staying anchored to the other elements
visually)
I hope this helps a bit
{{{
<html>
<head>
<title>Css rotation</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<style type="text/css">
.rotated {
transform: rotate(45deg);
}
</style>
</head>
<body>
<img src="./HAIKU square - white on blue.png"/>
<img src="./HAIKU square - white on blue.png"/>
<div class="rotated">
<img src="./HAIKU square - white on blue.png"
alt="eight ball" />
</div>
<img src="./HAIKU square - white on blue.png" alt="eight
ball" />
<div class="rotated">
<img src="./HAIKU square - white on blue.png"
alt="eight ball" />
</div>
<div class="rotated">
<img src="./HAIKU square - white on blue.png"
alt="eight ball" />
</div>
<img src="./HAIKU square - white on blue.png" alt="eight
ball" />
</div>
</body>
</html>
}}}
--
Ticket URL: <https://dev.haiku-os.org/ticket/15466#comment:9>
Haiku <https://dev.haiku-os.org>
The Haiku operating system.
