为什么以下样式在Firefox中不起作用? (它适用于所有其他浏览器)

时间:2011-01-25 13:41:54

标签: asp.net html css firefox3.6

编辑:版权信息不会出现在屏幕上,但它位于Firefox窗口的HTML源代码中!

ASP.NET页面:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="learnvb1._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Welcome to</title>
    <link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1"  runat="server">
        <div id="main_holder">
          <center>
            <asp:Label ID="Label1" runat="server" Text="Copyright &copy 2011 blah blah. All rights reserved."></asp:Label>
          </center>
        </div><!-- main_holder div ends -->
    </form>
</body>
</html>

StyleSheet1.css

body 
{
    background-color:Black;
}    
#main_holder
{
    position:fixed;
    margin-top:95%;
    padding-top:0.3%;
    background-color:Yellow;
    color:Green;
    overflow:auto;
    width:100%;
}

Firefox HTML:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.13) Gecko/20101203 Firefox/3.6.13

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
    Welcome to
</title><link href="StyleSheet1.css" rel="stylesheet" type="text/css" /></head>
<body>
    <form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMzA0NzMwODMzD2QWAgIDD2QWAgIBDw8WAh4EVGV4dAXAA0Jyb3dzZXIgQ2FwYWJpbGl0aWVzDQpUeXBlID0gRmlyZWZveDMuNi4xMw0KTmFtZSA9IEZpcmVmb3gNClZlcnNpb24gPSAzLjYuMTMNCk1ham9yIFZlcnNpb24gPSAzDQpNaW5vciBWZXJzaW9uID0gMC42DQpQbGF0Zm9ybSA9IFdpblhQDQpJcyBCZXRhID0gRmFsc2UNCklzIENyYXdsZXIgPSBGYWxzZQ0KSXMgQU9MID0gRmFsc2UNCklzIFdpbjE2ID0gRmFsc2UNCklzIFdpbjMyID0gVHJ1ZQ0KU3VwcG9ydHMgRnJhbWVzID0gVHJ1ZQ0KU3VwcG9ydHMgVGFibGVzID0gVHJ1ZQ0KU3VwcG9ydHMgQ29va2llcyA9IFRydWUNClN1cHBvcnRzIFZCU2NyaXB0ID0gRmFsc2UNClN1cHBvcnRzIEphdmFTY3JpcHQgPSAxLjQNClN1cHBvcnRzIEphdmEgQXBwbGV0cyA9IFRydWUNClN1cHBvcnRzIEFjdGl2ZVggQ29udHJvbHMgPSBGYWxzZQ0KU3VwcG9ydHMgSmF2YVNjcmlwdCBWZXJzaW9uID0gDQpkZGTubPxLL/PJfjQcbjhmJsHYoi86MA==" />
</div>        
    <span id="Label2">Browser Capabilities
Type = Firefox3.6.13
Name = Firefox
Version = 3.6.13
Major Version = 3
Minor Version = 0.6
Platform = WinXP
Is Beta = False
Is Crawler = False
Is AOL = False
Is Win16 = False
Is Win32 = True
Supports Frames = True
Supports Tables = True
Supports Cookies = True
Supports VBScript = False
Supports JavaScript = 1.4
Supports Java Applets = True
Supports ActiveX Controls = False
Supports JavaScript Version = 
</span>        
     <div id="main_holder">   
              <center>
        <span id="Label1">Copyright © 2011 blah and blah and blah. All rights reserved.</span>
        </center>
    </div>
    <!-- main_holder div ends -->           
    </form>
</body>
</html>

1 个答案:

答案 0 :(得分:3)

如果你添加这个CSS它应该有用:

html,  body { height: 100%; padding: 0; }

并将{main_holder CSS中的margin-top: 95%替换为bottom: 0;,如下所示:

#main_holder {
    position:fixed;
    bottom:0;
    padding-top:0.3%;
    background-color:Yellow;
    color:Green;
    overflow:auto;
    width:100%;
}

请参阅http://jsfiddle.net/fQ8sh/2/