背景の下にブートストラップ モーダルが表示される

ブートストラップ モーダルを使用すると、背景の下に表示され、応答しなくなる問題が発生する場合があります。モーダル コンテンツを操作する必要がある場合、これはイライラすることがあります。

この動作の背後にある原因は、モーダル要素とその親要素の位置にあります。モーダルの親コンテナが固定または相対 CSS プロパティを使用して配置されている場合、モーダルの意図したレンダリングが中断される可能性があります。

この問題を解決するには、モーダル コンテナとその祖先がデフォルトの配置になっていることを確認してください。これらの簡単な手順で問題は修正されます:

1. 特殊な位置でモーダル div を要素の外側に移動します: モーダル div を終了 タグの直前に配置して、不要な要素をバイパスします位置効果。
2. 位置 CSS プロパティを削除: または、モーダルから位置 CSS プロパティを削除し、問題がなくなるまで、その祖先要素を削除します。ただし、これによりページの外観と機能が変更される可能性があることに注意してください。