SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast runeer's Avatar
    Join Date
    Nov 2006
    Location
    Kuala Lumpur, Malaysia
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Footer position problem in IE6

    Hi Guys,
    Referring to http://www.virtuoso.com.my/emt/careers.php

    I have this problem in IE6:
    The footer does not scroll automatically to the bottom of page. Is the problem with CSS or Javascript? It works fine with Firefox.

    Helps appreciated. Cheers!

    Hong

  2. #2
    SitePoint Evangelist hexburner's Avatar
    Join Date
    Jan 2007
    Location
    Belgium
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You should set a height for the #container like this:
    min-height:100%;
    height:auto;
    _height: 100%;
    FOR SALE: 1 set of morals, never used, will sell cheap

  3. #3
    SitePoint Enthusiast runeer's Avatar
    Join Date
    Nov 2006
    Location
    Kuala Lumpur, Malaysia
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That doesn't work, and in fact, affected the layouts of other pages

  4. #4
    SitePoint Evangelist hexburner's Avatar
    Join Date
    Jan 2007
    Location
    Belgium
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's an example of a sticky footer:

    http://global-trade.be/import/
    FOR SALE: 1 set of morals, never used, will sell cheap

  5. #5
    SitePoint Enthusiast runeer's Avatar
    Join Date
    Nov 2006
    Location
    Kuala Lumpur, Malaysia
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanx, but my problem here is with IE6...

    My sticky footer works fine in every page, and include this, the career page in Firefox; in IE6 the footer doesn't refresh its position to the bottom when user choose different job post details.

    I've tried two sets of javascripts to display job post details, both works fine with footer in firefox, but not in IE6.

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,868
    Mentioned
    159 Post(s)
    Tagged
    4 Thread(s)
    HI,

    IE forgets position absolute bottom:0 is when you implement a change in the page length with javascript. You will need to use this method instead which works fine as I developed this years ago to overcome dynamic problems such as yours

    Code:
    #footer {
        width:760px;
        margin:-30px auto 0;
        position:relative;
        height:30px;
        background:url(http://www.virtuoso.com.my/emt/img/bg_footer.gif) white no-repeat;
        color: #000000;
    }
    Then move the footer outside of the main container as follows.

    Code:
                    <p class="bodytxt">Please submit your resum&eacute; via email to <a href="mailto:work@emtcorp.com.au" class="txt_blue">work@emtcorp.com.au</a> with daytime contact details so that we may reach you if there is a potential fit with sapio.</p>
                </div>
            </div>
            <!--end content-->
        </div>
        <!--end container-->
        <div id="clearfooter"></div>
    </div>
    <!--end align_body-->
    <div id="footer">
        <div id="footer_links"> <a href="#" class="links">privacy</a> <a href="#" class="links">legal</a> <a href="#" class="links">site map</a></div>
        <p class="copyright">copyright &copy; 2007 EMT. all rights reserved.</p>
    </div>
    <!--end footer-->
    </body>
    </html>
    If you do that correctly then it will work as I have tested locally

  7. #7
    SitePoint Enthusiast runeer's Avatar
    Join Date
    Nov 2006
    Location
    Kuala Lumpur, Malaysia
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh Thanx a lot!

    That works, but there's a minor problem in firefox -- a small gap at the bottom of page. Perfect in IE.

  8. #8
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,868
    Mentioned
    159 Post(s)
    Tagged
    4 Thread(s)
    Its the top margin on your copyright. Use this instead.

    Code:
    #footer p.copyright {
        text-align:right;
        font-family:Arial, Helvetica, sans-serif;
        font-size:10px;
        color:#006699;
        position:relative;
        top:5px;
        margin-right: 10px;
    }

  9. #9
    SitePoint Enthusiast runeer's Avatar
    Join Date
    Nov 2006
    Location
    Kuala Lumpur, Malaysia
    Posts
    39
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Talking

    Oh well, was trying to add "display:block; & float:right;"

    Thanks a lot!


Bookmarks

Posting Permissions

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