Using SVG's in a grid layout seems to alter the size of SVG sub elements. I expect all squares in this reproduction to have the same size. In other browsers they do have the same size, in Safari/Webkit they do not. reproduction : - https://github.com/romainmenke/safari-svg-display-grid-bug-0001 - https://romainmenke.github.io/safari-svg-display-grid-bug-0001/
Correction, this does not seem related to display grid. This issue can be closed.
(In reply to romain from comment #1) > Correction, this does not seem related to display grid. > This issue can be closed. What do you believe this to be related to? At least for me https://romainmenke.github.io/safari-svg-display-grid-bug-0001/ looks the same across STP, Firefox Nightly, and Chrome Canary.
I initially came to the conclusion that this was related to grid, but I was fiddling with both the DOM structure and CSS properties simultaneously. I've updated the reproduction with new info : https://github.com/romainmenke/safari-svg-display-grid-bug-0001/blob/main/README.md I found that simply adding plain text before an SVG is sufficient to give child rect elements an incorrect size. I haven't tested with other types of child elements like a circle or paths. ---- Do you prefer that I file a new report, now that I better understand the issue? Personally I think that would be clearer than altering this report.
> Do you prefer that I file a new report, now that I better understand the issue? That seems reasonable, I think?