WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED DUPLICATE of
bug 23113
Bug 93358
inline-block span positioned "relative" inside foreignObject are not scaled correctly
https://bugs.webkit.org/show_bug.cgi?id=93358
Summary
inline-block span positioned "relative" inside foreignObject are not scaled c...
Frédéric Wang (:fredw)
Reported
2012-08-07 05:33:27 PDT
Created
attachment 156918
[details]
testcase A MathJax user reported that the HTML+CSS code generated by MathJax to display mathematical formulas is not rendered correctly in Webkit when scaled inside SVG:
https://github.com/mathjax/MathJax/issues/279
The code generated by MathJax contains many <span>'s and it's hard to say what the problem is. However, I think I have isolated one issue with <span style="display: inline-block; position: relative;">, which are used everywhere in the generated code. In the attached testcase, such a span is used to draw a 50x50 red rectangle. I use SVG to scale it by a factor of 2. In Firefox, it thus fits in the 100x100 black frame. However in Webkit this rectangle is still rendered with a size of 50x50. Note that if you use "position: static;", it is correctly scaled.
Attachments
testcase
(473 bytes, text/html)
2012-08-07 05:33 PDT
,
Frédéric Wang (:fredw)
no flags
Details
Another test case.
(697 bytes, text/html)
2012-11-18 21:41 PST
,
Neil
no flags
Details
Safari 15.5 differs from other browsers
(524.02 KB, image/png)
2022-06-17 16:43 PDT
,
Ahmad Saleem
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
Frédéric Wang (:fredw)
Comment 1
2012-08-07 05:37:46 PDT
Of course, this affects both coordinates and size. You can try to use "left: 25px; top: 25px; width: 25px; height: 25px;" in the testcase.
Neil
Comment 2
2012-11-18 21:41:40 PST
Created
attachment 174887
[details]
Another test case. This bug prevents the use of Closure UI widgets in SVG. Attached is an independently created testcase. Works fine in Gecko.
Eric Seidel (no email)
Comment 3
2012-11-18 22:01:47 PST
SVG trees don't have RenderLayers. It's a loooong standing bug. :(
Nikos
Comment 4
2020-09-01 12:38:43 PDT
Not just span everything, see
https://stackoverflow.com/questions/63690664/safari-macos-foreign-object-not-positioned-properly-inside-svg
Ahmad Saleem
Comment 5
2022-06-17 16:43:36 PDT
Created
attachment 460320
[details]
Safari 15.5 differs from other browsers I am able to reproduce this bug in Safari 15.5 on macOS based on attached "Another Test", it is also reproducible using other test case but I am attaching just one screenshot for reference. All other browsers match each other as shown in the screenshot as well. Thanks!
Radar WebKit Bug Importer
Comment 6
2022-06-17 16:44:04 PDT
<
rdar://problem/95422479
>
Simon Fraser (smfr)
Comment 7
2022-06-17 20:35:29 PDT
position:relative triggers RenderLayer, so dup of
bug 23113
. *** This bug has been marked as a duplicate of
bug 23113
***
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug