Firefox does not support alignment-baseline on SVG text
authorAlexander Ebert <ebert@woltlab.com>
Thu, 20 Apr 2017 12:16:46 +0000 (14:16 +0200)
committerAlexander Ebert <ebert@woltlab.com>
Thu, 20 Apr 2017 12:16:46 +0000 (14:16 +0200)
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/alignment-baseline
shows examples using a <text> element, but they're broken in Firefox (oh
the irony!).

The `dominant-baseline`-attribute has the same outcome and can be used
instead. Thanks @Morik

wcfsetup/install/files/lib/data/user/avatar/DefaultAvatar.class.php

index 9acd6c30e480bb934f85673b5395e530d4316afe..1fa5e815292d9c4d137b9ad54184b18aacddbc99 100644 (file)
@@ -54,7 +54,7 @@ class DefaultAvatar implements IUserAvatar {
                        
                        // the <path> is basically a shorter version of a <rect>
                        $svg = <<<SVG
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#{$backgroundColor}" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#{$textColor}" text-anchor="middle" alignment-baseline="central" font-family="Arial" font-size="7">{$text}</text></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#{$backgroundColor}" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#{$textColor}" text-anchor="middle" dominant-baseline="central" font-family="Arial" font-size="7">{$text}</text></svg>
 SVG;
                        
                        $this->src = "data:image/svg+xml;base64," . base64_encode($svg);