Bootstrapのモーダルダイアログを表示すると、画面の一部が操作不能になる（IE限定）

IE限定で発生する事象ですが、Bootstrapもモーダルダイアログを表示すると、ダイアログを閉じた後に画面の一部が操作出来なくなる現象が発生しました。

現象が発生した環境

• Internet Explorer 11
• Bootstrap 3.1.1

縦スクロールが発生するようなページで、下記のようなCSSを定義した状態でモーダルダイアログを表示すると、

• ダイアログ表示時に、ページの一番上までスクロールする
• ダイアログを閉じた後に、画面下部のボタン・リンクなどが操作不能となる

といった現象が発生しました。

html {
  height: 100%;
  overflow-y: scroll;
}

上のCSS定義のうち、どちらか一方だけしか定義していない場合は問題なく、両方を定義した場合にのみ発生します。

IE対応として上のようなCSSをコピペすることがあるかと思いますが、注意が必要です。