IE11でembedで埋め込んだpdfが他の要素の上に被さる

Question

お世話になります。

embedタグを使用してpdfを埋め込んでいます。

<embed src="test.pdf" wmode="transparent" type="application/pdf" width="100%" height="1200"></embed>

これをIE11で閲覧するとヘッダーメニューなど本来は画面の最前面に出てこないといけない要素の上に被さってしまいます。
IE以外のブラウザではおきません。色々調べてHACK的な手法で以下のタグを表示させたい要素に埋め込めば一応はpdfの上に要素が表示されるようになりますが。

  <iframe style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1;" src="about:blank"></iframe>

ただこれだとスクロールしたときにメニューがちらつき、見栄えが非常に悪いです。
調べるとwmode="transparent"にするとうまくいくという記述を見るのですが、この場合うまくいきません。

要はz-indexが効いていない状態なのだと思いますが、
いい解決方法を教えていただけますでしょうか。

よろしくお願いいたします。

Comments

[yoshinavi]

「<embed></embed>」部と、ヘッダー部が重なるのであれば、<embed>周りと、ヘッダー部分のHTML・CSSのコードも提示された方がより良い回答を得れると思います。

[defghi1977]

stackoverflowに同等の質問がありました https://stackoverflow.com/questions/12911428/z-index-does-not-work-in-internet-explorer-with-pdf-in-iframe

Answer 1

質問の追記にもありましたが、やはり

<iframe style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1;" src="about:blank"></iframe>

を要素内の末尾に追加するしか方法がないようです。