Bug 171027 - Root SVG in CSS should transform around 50% 50%
Summary: Root SVG in CSS should transform around 50% 50%
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2017-04-19 18:28 PDT by Dean Jackson
Modified: 2018-07-21 02:20 PDT (History)
3 users (show)

See Also:


Attachments
bad test (175 bytes, image/svg+xml)
2017-04-19 18:32 PDT, Dean Jackson
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Dean Jackson 2017-04-19 18:28:33 PDT
data:image/svg+xml,<svg%20xmlns="http://www.w3.org/2000/svg"%20width="200"%20height="200"%20style="border:%205px%20solid%20red"><rect%20x="50"%20y="50"%20width="100"%20height="100"/></svg>

shows that the root SVG can be treated as a CSS box

however, if you put a transform on:

data:image/svg+xml,<svg%20xmlns="http://www.w3.org/2000/svg"%20width="200"%20height="200"%20style="transform:rotate(45deg);%20border:%205px%20solid%20red"><rect%20x="50"%20y="50"%20width="100"%20height="100"/></svg>

You'll see it is being rotated with the SVG value of transform origin.

The same occurs for embedded SVGs. Other browsers do this with a 50% 50% transform origin.
Comment 1 Dean Jackson 2017-04-19 18:32:36 PDT
Loading a standalone SVG file works ok though, confusingly.
Comment 2 Dean Jackson 2017-04-19 18:32:57 PDT
Created attachment 307538 [details]
bad test
Comment 3 Radar WebKit Bug Importer 2017-04-19 18:33:31 PDT
<rdar://problem/31722981>
Comment 4 Dirk Schulze 2018-07-21 02:19:25 PDT
Dean: The example looks the same in Firefox. Can this get closed?