Applying a CSS translate transform like translate(100%) or translateY(50%) on an SVG element does not work in Firefox. The spec says that the translation parameters can be lengths or percentages http://dev.w3.org/csswg/css-transforms/#two-d-transform-functions but, in this case, the percentage values don't work (they don't work in the case of transform-origin either https://bugzilla.mozilla.org/show_bug.cgi?id=891074 ). This works in Chrome/ Opera and Safari. IE does not implement CSS transforms on SVG elements yet.
4 years ago
Component: Untriaged → SVG
Product: Firefox → Core
This now works provided svg.transform-origin.enabled is true
Status: NEW → RESOLVED
Last Resolved: 4 years ago
Depends on: 923193
Resolution: --- → FIXED
This is still an issue. Percentages are not working.
(In reply to barrett.harber from comment #2) > This is still an issue. Percentages are not working. Create a new bug if you still have issues. It's pretty likely you either believe Chrome's implementation is correct (it isn't per the specification) or that you are depending (or should depend) on transform-box
You need to log in before you can comment on or make changes to this bug.