CSS transformation not applied to svg subelements (path circle etc)

RESOLVED FIXED

Status

()

Core
SVG
RESOLVED FIXED
3 years ago
6 months ago

People

(Reporter: PeterStJ, Unassigned)

Tracking

37 Branch
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

3 years ago
User Agent: Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.65 Safari/537.36

Steps to reproduce:

svg
  path.one
  path.two

.one { transform: rotate(90deg) }


Actual results:

Transformation is listed in console but is not applied visually (i.e. path element is not rotated)


Expected results:

Chrome and Safari and IE rotate the single path element according to the css style rule
Can you please attach a testcase showing the problem?  Because as far as I can tell this is working just fine (at least in a current Firefox nightly on Mac).
Created attachment 8526003 [details]
Testcase that shows the rotate working fine for me
(Reporter)

Comment 3

3 years ago
Sorry it was my mistake, the actual code was combination of translateX and rotate and because the translation was 0% I thought it was the rotation.

Further testing revealed that transform origin is not working when provided with % values and translate is also not working at all when provided as % values.

test case here: 
http://jsbin.com/numovu/1/edit?html,css,output

adding  0% to the transform origin shows the path but it is not translated properly.
Ah, thanks.

It looks like the percentage basis used in this case is 0.  Per spec, since 'transform-box' is not being used, we should be using the "view-box", which means we should be using the nearest SVG viewport.
Component: General → SVG
Basically this is the same issue as bug 923193. nsDisplayTransform doesn't support percentage values in CSS transforms on SVG right now.
Depends on: 923193
OS: Linux → All
Hardware: x86 → All
(Reporter)

Comment 6

3 years ago
Ok thanks. I will be following the referenced bug report.

Comment 7

6 months ago
fixed by bug 923193
Status: UNCONFIRMED → RESOLVED
Last Resolved: 6 months ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.