How to do a horizontal line in a vertical flowchart without the lines being all messed up?

[chiafish]

Haven't seen anyone with this issue yet and it's driving me nutssssss
My knowledge on mermaid is pretty limited and I just started learning how it works since I want to use it in Notion.
This is what I want:

This is the best I can do lmao:

Any suggestions?

[PstasDev]

Hi there!

Mermaid syntax can indeed be a bit tricky when you're trying to do something out of the ordinary, like mixing flow directions.

Here's a snippet that might help you achieve a layout close to what you're describing:

flowchart TB
    subgraph main
    A --- B --- C
    end
    subgraph for_rightbox
        direction RL
        B --- Rightbox
    end
    subgraph for_leftbox
        direction LR
        Leftbox --- C
    end

Loading

This setup uses subgraphs to change the direction of the flow for specific parts of your chart. While Mermaid doesn't offer extensive options for relative or absolute positioning of boxes directly in its syntax, this approach might be the closest to achieving a mixed-direction flowchart.

If you're looking for more advanced layout options, I recommend checking under the Directives menu of the Mermaid documentation: Mermaid Directives. There might be additional configurations there that could help fine-tune your flowchart's appearance.

Hope this helps, and happy diagramming!