Bug: Mermaid labels were not displayed properly.

[jinghuazhao]

Description

I have embedded a mermaid diagram, a flowchart with URLs associated with each node, it would be perfectly fine with Mermaid Live Editor but labels in the associate svg would be cut off from the bottom.

Steps to Reproduce

1. The URL for the diagram is here, http://tinyurl.com/54j8t9bp
2. From the left panel, select Actions, save links from svg to obtain the corresponding figure.
3. Paste the svg directly into Markdown document.

Expected behavior

Screenshots (If Necessary)

Environment (If Necessary)

• OS: [e.g. Github Pages, Windows 10, macOS 10.13, Linux(CentOS 7.5), iOS 11, Android 8(Pixel 2)]
• Ruby: [e.g. Github Pages, 2.4.0p0]
• Jekyll: [e.g. Github Pages, 3.7.3]
• Browser: [e.g. Chrome, Safari, Edge, Firefox]

[jinghuazhao]

This appears to be a problem with SVG itself by Mermaid Live Editor, and a compromise is to set font-size: 90%; Also see here, mermaid-js/mermaid#790

[jinghuazhao]

This is what the diagram looks now.