Forum Bugs

transform-origin attribute in SVG not properly supported?

Hi, I'm learning SVG and not quite sure if this is a bug. With the following code, the blue box is properly centered in Chrome but not in the PDF output of Prince, as if the transform-origin attribute is not specified. The doc doesn't mention it's unsupported. Thanks!

<!DOCTYPE html>
    <svg width="100" height="100" style="background-color: #e4e4e4" version="1.1" xmlns="">
        <rect x="30" y="30" width="40" height="40" fill="transparent" stroke="red" />
        <rect x="30" y="30" width="40" height="40" fill="rgba(200,200,255,0.5)" stroke="blue" transform="scale(2, 0.5)" transform-origin="50% 50%" />
Prince doesn't support the transform-origin property on SVG, but you can achieve the same effect by adding translations to the transform attribute as I recall.
Thanks! But it's not mentioned in the "current not supported" list in the doc. I understand that documentation cannot be up-to-date in all aspects. As proposed in the other post, an interactive shell would be priceless for the users to explore DOM features.
To be fair, the documentation says that Prince supports SVG 1.1 (with some exceptions).
transform-origin was introduced in SVG 2, by reference to the css-transforms-1 spec.
Thank you! That's my mistake.