css.properties.transform-box - no Safari support in some (all?) SVG elements
Nobody has claimed this yet.
- Dominant language
- JSON
- Stars
- 5.8k
- Forks
- 2.6k
- Avg merge
- 1d 21h
- Merged PRs (30d)
- 186
Description
MDN URL
https://developer.mozilla.org/en-US/docs/Web/CSS/transform-box
What specific section or headline is this issue about?
transform-box does not work with svg text elements
What information was incorrect, unhelpful, or incomplete?
transform-box: border-box is a wonderful option for rotating svg text that uses x/y attribute positioning, but sadly this does not work on Safari. This became a foot gun in my case because the MDN docs gave me no reason to suspect I couldn't use transform-box for Safari and testing on Chromium/Gecko was of course unaffected.
What did you expect to see?
A compatibility caveat added to the support matrix. I.e. "* Not supported in SVG for WebKit/Safari"
Do you have any supporting links, references, or citations?
Do you have anything more you want to share?
Thank you MDN team. MDN docs are truly amazing and I use them almost every day.
MDN metadata
Page report details
- Folder:
en-us/web/css/transform-box - MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-box
- GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/css/transform-box/index.md
- Last commit: https://github.com/mdn/content/commit/0cc9980e3b21c83d1800a428bc402ae1865326b2
- Document last modified: 2025-07-14T14:43:58.000Z
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Review the transform-box page at files/en-us/web/css/transform-box/index.md and the linked WebKit/Safari reference first. Verify the reported behavior for SVG text elements, then update the support matrix with an accurate Safari caveat if confirmed; done means the compatibility data clearly reflects the supported scope.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- documentation
- Issue type
- Documentation
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100