bootstrap4のモーダルの内容が長い時にスクロールできるようにしたい

bootstrapのモーダルを使っています。

bootstarp4では、デフォルトでもLongバージョンがあって、それをそのまま公式サイトからコピペすればおそらくスクローラブルなモーダルが作れるのだと思います。

私は、センタリングできる、という説明のところのhtmlをコピペしたので、Longバージョンと記述でどこが違うのかわからないのですが、なぜかスクロールできませんでした。

調べた結果、.modal-body をオーバーライドして、スクロールできるように設定するのが良い、というのが多く見つけた答えでした。

ただ、これですと、例えばモーダルを、modal-header , modal-body , modal-footer などに分けていると、 modal-body だけがスクロールできることになってしまいます。

ということで、以下のように書いたところ、思った通り、スクロールするようになりました。

.modal {
    max-height: 100%;
    overflow-y: auto;
}

一部のサイトでは、 height: ○○px というように書かないとダメという記載を見ましたが、色々試した見た所 max-height: 100% と書くことで、私が思っていた形にできました。

この辺りは、それぞれの用途に応じて、試してみるといいと思います。