Any ideas here? I have an SVG, and it looks OK in previews. But when going live online, the image turns into something completely different. It appears this alternate way on mobile and desktop browsers. But the same exact SVG element appears elsewhere on the page and looks fine. Here’s an image of what it’s supposed to look like (second image, smooth type), and one of what it outputs (first image, odd spaced different font):
Sounds like an issue with the SVG… I wonder if you’re specifying a font, and not an online one. Can you share a link to the site, and/or SVG file so we can take a look?
In the SVG export options you have to specify to convert the text to a path, or (and this is the best solution) convert the text to a path first, then join all the letters in a single shape and only then export it
Thanks that seems to be the culprit. The asset was an SVG that was exported out of Illustrator. Rather than a straight export, we tried converting it to outlines within Illustrator first, then exporting as SVG - it seemed to fix things.
Illustrator can export an SVG with links to external libraries, which makes sense in projects with shared assets, but not in our case.
