2009-10-13 73 views
0

我想打开框架中的模式弹出框。我在这里粘贴了框架的htlm代码和css样式,此代码适用于IE7.0,但不适用于IE6。在IE6.0中,我在面板中看到滚动条。什么会导致这个问题?我该如何解决它?IFRAME中的CSS问题

我通过这些宽度和高度在我的主页中打开框架。

<cc1:modalpopupextender ID="mdlDelete" runat="server" PopupControlID="PnlFrameDelete" BackgroundCssClass="modalBackground" OkControlID="btnDeleteOk" CancelControlID="btnDeleteCancel" TargetControlID="btnDelete" > 
</cc1:modalpopupextender><asp:Panel ID="PnlFrameDelete" runat="server" style="display:none"> 
<iframe id="deletefrm" frameborder="0" src="../Frame/deletefrm.aspx" height="98px" width="342px" > </iframe> <div> <asp:Button ID="btnDeleteOk" runat="server" Text="Yes" Width="40px" style="display:none" /> <input id="btnDeleteCancel" type="button" value="No" style="width:20px;display:none" /> </div> </asp:Panel> 
<body style="margin: 0px;"> 

这是框架的ASPX:

<form id="form1" runat="server"> 
<asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:Panel ID="pnlDelete" runat="server" CssClass="modal-dialog"> <div class="container"> <div class="header"> 
<div class="msg">Warning</div> <asp:LinkButton ID="LinkButton1" runat="server" CssClass="close" OnClientClick="$find('mdlDelete').hide(); return false;" /> </div><div class="body"> <h2><asp:Label ID="lblMsg" runat="server" Text="Are u sure?"></asp:Label></h2> </div> <div class="footer"> <div class="right"> 
<asp:Button ID="btnDeleteOk" runat="server" Text="Yes" Width="40px" OnClientClick="okay();" /> <input id="btnDeleteCancel" type="button" value="No" onclick="cancel();" style="width:40px" /> </div> </div> </div> </asp:Panel> </form> 

这是CSS:

/* dialog frame */ 
.modal-dialog 
{ 
    position:absolute; 
    margin:auto; 
    height:98px; 

} 

/* dialog contents container */ 
.modal-dialog .container 
{ 
    font-family:tahoma,helvetica,arial,sans-serif; 
    font-size:11px; 
    width:340px; 
    border:solid 1px #99aabd; 
    background-color:#F2F9FF; 
    padding: 0px 0px 0px 0px; 
} 

/* dialog header */ 
.modal-dialog .header 
{ 
    background:url(../images/sprite.gif) repeat-x 0px -1100px; 
    height:20px; 
    padding-top:5px; 
} 

/* dialog header message */ 
.modal-dialog .header .msg 
{ 
    vertical-align:middle; 
    padding-left:6px; 
    color:#fff; 
    font-size:12px; 
    font-weight:bold; 
}   

/* dialog body */ 
.modal-dialog .body 
{ 
    height:40px; 
    background-color:#F2F9FF; 
} 

/* dialog body message */ 
.modal-dialog .body h2 
{ 
    padding-top:10px; 
    background-color: #F2F9FF; 
    font-size:14px; 
    text-align:center; 
    font-weight:normal;  
} 

/* dialog footer */ 
.modal-dialog .footer 
{ 
    height:30px; 
    background-color: #F2F9FF; 
} 

/* dialog footer buttons */ 
.modal-dialog .footer .right 
{ 
    background-color: #F2F9FF; 
    float:none; 
    text-align:center; 


} 

/* dialog footer checkbox */ 
.modal-dialog .footer .left 
{ 
    background-color: #F2F9FF; 
    float:left; 
    text-align:left; 

} 

/* dialog close */ 
.modal-dialog .close 
{ 
    right:4px; 
    background: url(../images/icons.gif) no-repeat -732px 0px; 
    width:16px; 
    cursor:hand;  
    position:absolute; 
    top:5px;  
    height:16px; 
} 

/* dialog close hover */ 
.modal-dialog .close:hover { background: url(../images/icons.gif) no-repeat -749px 0px; } 

/* modal overlay */ 
.modalBackground 
{ 
    background-color:Gray; 
    filter:alpha(opacity=50); 
    opacity:0.5; 
} 

回答

0

那么从快看,我已经看到你的框架设置为宽而您的容器在CSS中设置为340。您还可以在容器中的某些元素上设置填充。您必须将其包含在容器的宽度和高度以避免滚动条。

+0

但为什么它在IE 6.0会导致问题在IE 7.0我没有问题 – Alexander 2009-10-13 13:50:26