Unexpected vertical space around graph

When node labels increase the width of my chart the chart elements shrink to fit in the horizontal space. But it seems like the overall height of the chart container remains fixes so that the wider the chart to more empty vertical space there is above and below the contents.

This is very unhelpful for documentation. Is there a way to make the container hug the contents?

Here is my chart code:

flowchart TD
    LEVEL1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ1]
        %% LEVEL2
        LEVEL1 --- LEVEL2-1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ2] 
            %% LEVEL3
            LEVEL2-1 --- LEVEL3-1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ3]
                %% LEVEL4
                subgraph sg-LEVEL4-1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ4]
                    LEVEL4-11[Label] -.-
                    LEVEL4-12[Label]
                end
                LEVEL3-1 --- sg-LEVEL4-1
                    %% LEVEL5
                    sg-LEVEL4-1 --- LEVEL5-1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ5]
                        %% LEVEL6
                        LEVEL5-1 --- LEVEL6-1[Lorem ipsum dolor sit amet pallenque dux bellorum in situ6]
                            %% LEVEL7
                            LEVEL6-1 --- LEVEL7[Lorem ipsum dolor sit amet pallenque dux bellorum in situ7]
            %% LEVEL3
            LEVEL2-1 --- LEVEL3-2[Lorem ipsum dolor sit amet pallenque dux bellorum in situ3]
                %% LEVEL4
                subgraph sg-LEVEL4-2[Lorem ipsum dolor sit amet pallenque dux bellorum in situ4]
                    LEVEL4-21[Label] -.-
                    LEVEL4-22[Label] -.-
                    LEVEL4-23[Label]
                end
                LEVEL3-2 --- sg-LEVEL4-2
            %% LEVEL5
            sg-LEVEL4-2 --- LEVEL5-1
        %% LEVEL2
        LEVEL1 --- LEVEL2-2[Lorem ipsum dolor sit amet pallenque dux bellorum in situ2]
            %% LEVEL3
            LEVEL2-2 --- LEVEL3-3[Lorem ipsum dolor sit amet pallenque dux bellorum in situ3]  
                %% LEVEL4
                subgraph sg-LEVEL4-3[Lorem ipsum dolor sit amet pallenque dux bellorum in situ4]
                    LEVEL4-31[Label] -.-
                    LEVEL4-32[Label] -.-
                    tacitcs-33[Label]
                end
                LEVEL3-3 --- sg-LEVEL4-3
            LEVEL2-2 --- LEVEL3-4[Lorem ipsum dolor sit amet pallenque dux bellorum in situ3]     
                %% LEVEL4
                subgraph sg-LEVEL4-4[Lorem ipsum dolor sit amet pallenque dux bellorum in situ4]
                    LEVEL4-41[Label] -.-
                    LEVEL4-42[Label] -.-
                    LEVEL4-43[Label]
                end  
                LEVEL3-4 --- sg-LEVEL4-4 
            %% LEVEL5
            sg-LEVEL4-3 --- LEVEL5-1
            sg-LEVEL4-4 --- LEVEL5-1
        %% LEVEL2
        LEVEL1 --- LEVEL2-3[Lorem ipsum dolor sit amet pallenque dux bellorum in situ2]
            %% LEVEL3
            LEVEL2-3 --- LEVEL3-5[Lorem ipsum dolor sit amet pallenque dux bellorum in situ3]
                %% LEVEL4
                subgraph sg-LEVEL4-5[Lorem ipsum dolor sit amet pallenque dux bellorum in situ4]
                    tactic-51[Label] -.-
                    tactic-52[Label] -.-
                    tactic-53[Label]
                end
                LEVEL3-5 --- sg-LEVEL4-5
            sg-LEVEL4-5 --- LEVEL5-2[Lorem ipsum dolor sit amet pallenque dux bellorum in situ5]
        %% LEVEL6
        LEVEL5-2 --- LEVEL6-2[Lorem ipsum dolor sit amet pallenque dux bellorum in situ6]
    %% LEVEL7
    LEVEL6-2 ---LEVEL7
    %%
    %% LINKS
    click LEVEL2-01 "www.google.com" _self
    %%
    %% STYLE
    %% Current node
    style LEVEL1 fill:#000,color:#fff
    %% linkStyle 2,3,9,10 stroke:#ffffde

[aliciahurst]

Adding to this since it is the most recently created and has a good roll up of all the other issues.

Hi @knsv! As you probably know, Github has added out of the box rendering support for Mermaid 🙌🏻 but this longstanding bug makes sequence diagrams unusable for documentation as stated above. Since there were so many workarounds proposed, I had hoped Github would spot it during development and fix it themselves, but they did not. I reported this to them as a bug when they released it. They wrote back that they don’t think the workarounds fit their use case and believe that it should be fixed within the Mermaid project itself.

I’ve observed that the longer the action text the more whitespace, especially with a lot of actors. For example:

sequenceDiagram
A-->B: Hello
B-->C: Hey this is a really long line
C->>D: Howdy, I like turtles and I think this is interesting
D->>E: Hiya, what if I make this line long
E->>B: How are you?
B->>C: Fine thanks, and yourself? It's great to hear that you're doing so well
C->>A: Good to hear
A->>E: How's the family?
E->>B: Good thanks

👋🏻 … all the way down here. I hope this is helpful, and I think a few dozen people at this point would really appreciate a fix.

[mondegreengames]

Sounds like #1800, #1758, #1929, #1984, #2649, #2481