The svgs generated by dvisvgm seem to influence one another when placed in a html document.
For example, this is how it should look: https://jsfiddle.net/y8nq7xnz/1/
On the other hand, when I take the upper svg and move it below the other svg, the result gets messed up: https://jsfiddle.net/ubq3n30c/3/
Question: Which parts are problematic, and what could I do so this can't happen again? I though about storing the svg to a file and not using inline svg, but this would be my least preferred option.
Thanks for any ideas.
I noticed a very weird bug the other day. For my website, I wanted to include Latex-SVGs rendered by dvisvgm. The resulting svg looks just fine, except when it's a certain positions in the html. For example:
Right below the body tag, the svg looks fine.
The image looks very bad at another position in the page.
My first suspect was css, but this can't be the case, since the "correct/wrong-toggle" also happens when I move the svg within areas that have the same styling applied.
You can find the svg at https://jsfiddle.net/ubq3n30c/. In the jsfiddle it also looks fine, also in every other page I inserted it. Just my page seems to give the latex-svg a hard time, on some positions...
Any ideas what this could be?