## 概要
[[Mermaid]]を使って以下のような図を書いた場合...
~~~txt
```mermaid
graph LR
AAA --> BBB
BBB --> CCC
CCC --> DDD
DDD --> EEE
EEE -----> FFF
```
~~~
こんな風にはみ出てしまうので何とかしたい。
![[Pasted image 20220817221712.png|frame]]
## ソリューション
以下の[[CSS]]を追加します。
```css
.mermaid svg {
max-width: 100%;
height: auto;
}
```
エディタの横幅最大値に収まります。
![[Pasted image 20220817221939.png|frame]]
## 参考
- [Ability to resize and align mermaid diagrams \- Feature requests \- Obsidian Forum](https://forum.obsidian.md/t/ability-to-resize-and-align-mermaid-diagrams/7019)