DIV在嵌入式文檔上的絕對定位

我試圖在StackOverflow上找到類似的問題，但只能找到與Flash對象相關的問題。DIV在嵌入式文檔上的絕對定位

我嘗試使用下面的代碼與所有三種標記，定位在嵌入對象的頂部一個div - iframe中，對象&嵌入：

<html> 
<head> 
<style> 
.overlay { 
    background:#FFFFFF; 
    border:1px solid #000000; 
    padding:30px; 
    position:absolute; 
    top:20px; 
    left:50%; 
    width:100px; 
    margin-left:-50px; 
    z-index:99; 
} 

.wrapper { 
    text-align:center; 
    background:#F00; 
    padding:20px; 
    position:relative; 
    z-index:2; 
} 

</style> 
</head> 

<body> 
    <div class="overlay">Overlay DIV</div> 
    <div class="wrapper"> 
     <embed width="100%" height="100%" src="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></embed> 
     <!--<object width="100%" height="100%" data="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></object>--> 
     <!--<iframe width="100%" height="100%" src="http://www.foxitsoftware.com/resources/pdf/Datasheet_Reader.pdf" frameborder="0"></iframe>--> 

    </div> 

</body> 
</html>

在Firefox和Chrome的最新版本的偉大工程但不是IE9。我需要它在IE8和更高版本中工作。

在IE8 +中完全可以做到嗎？

來源

2014-04-11 Roman

您可以在疊加層下放置一個iframe。 http://jsfiddle.net/emn178/64XeK/

<style> 
iframe { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    z-index: -1; 
} 
</style> 

<div class="overlay">Overlay DIV<iframe frameborder="0"></iframe></div>

這是我找到的最好方式。

來源

2014-04-11 02:11:06 emn178

感謝您的回答，但在IE中仍然沒有運氣。我的原始代碼可以在Firefox中正常工作。 – Roman

DIV在嵌入式文檔上的絕對定位

回答

相關問題