Vertical alignment of multiline nodes incorrect when downloaded from live editor.

[dloeckx]

Description

When I download a png or svg from the live editor with a multi-line node, the vertical alignment of the text is wrong, causing the text to be partially invisible. When I open the png or svg in the browser, everything looks fine.

Steps to reproduce

1. Go to the live editor
2. Paste the code below
3. Under actions, download the image with
   --> the text in the node is partially invisible
4. Under actions, open the image in a new window with
   --> Everything looks fine.

Screenshots

Broken png (downloaded):

Correct png (copy-paste from browser png):

Code Sample

flowchart TD
  TXT("`Multi
    Line`")

Setup

• Mermaid version: Mermaidv10.6.1 Live Editor
• Browser and Version: Mac, multple browsers (Chrome, Vivaldi, Safari)

Suggested Solutions

No response

Additional Context

I encountered this bug when exporting pdfs with embedded Mermaid Graphs using Mermaid Diagrams for Confluence