Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts

    Question Fixed Footer in Firefox?

    Hello,
    I've found this script:

    PHP Code:
    <!-- IE in quirks mode -->
    <!
    DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
    <
    title>Fixed footer</title>
    <
    style type="text/css">
     
    body{
      
    margin:0;
      
    padding:0 0 <length0;
     }
     
    div#footer{
      
    position:absolute;
      
    bottom:0;
      
    left:0;
      
    width:100%;
      
    height:<length>;
      
    background:#C0C0C0;
      
    text-align:center;
      
    font-family:verdana;
      
    font-size:10px;
      
    padding:5px;
      
    font-weight:bold;
     }
     * 
    html body{
      
    overflow:hidden;
     } 
     * 
    html div#content{
      
    height:100%;
      
    overflow:auto;
     }
    </
    style>
    <
    div id="content">

    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />content<br /><br />
    </
    div>
    <
    div id="footer">My Footer</div
    this is for a fixed footer, it's currectly in IE, but not at all in firefox, was hoping that someone here might know how to fix this?

    thanks in advance for your time!

  • #2
    New Coder
    Join Date
    Sep 2006
    Location
    Netherlands
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you changed <length> to something like 50px?
    if not, try that

    and I suggest you delete the doctype line,
    and swap it for something like

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    it may kill the IE-version, but I suggest you stick to standards and use a valid and complete doctype. Design on firefox, not on IE. Often it's easier to work with IE because it doesn't follow all the standards, but renders more 'naturally'. Firefox (and mozilla/netscape/opera) render far more by standards, presenting (pretty much) the same output between these browsers. IE always ****s up though. always IE, not the other way around.
    Last edited by Desdinova; 09-20-2006 at 05:41 PM.
    As a rule, I never touch anything more sophisticated and delicate than myself.

  • #3
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts
    yah, i just tried that, it didn't seem to make any difference in either IE or Firefox.

    thanks again for your time!
    -Ken

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Try this
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Fixed footer</title>
    <style type="text/css">
    html, body {
    margin:0;
    padding:0;
    border:0;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:10px;
    }
    #container {
    min-height:100%;
    }
    #clearfoot {
    clear:both;
    height:60px;
    overflow:hidden;
    }
    #footer{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:50px;
    background:#C0C0C0;
    text-align:center;
    padding:5px;
    font-weight:bold;
    }
    </style>
    <!--[if lte IE 6]>
    <style type="text/css">
    html {
    overflow-y:hidden;
    overflow-x:hidden;
    }
    body {
    overflow-y:auto;
    height:100%;
    }
    #footer {
    position:absolute;
    bottom:-1px;
    width:expression(parseFloat(document.body.clientWidth - 10));
    }
    </style>
    <![endif]-->
    </head>
    <body>
    <div id="container">
    	<div id="content"> content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    		content<br />
    		<br />
    	</div>
    	<div id="clearfoot">&nbsp;</div>
    	<div id="footer">My Footer</div>
    </div>
    </body>
    </html>
    It uses an IE expression for the width but other than that the footer is fixed without JS.
    ||||If you are getting paid to do a job, don't ask for help on it!||||


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •