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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Apr 2010
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question Center footer fixed at the bottom IE

    I am coding a web interface for a University project and I have been dealing with this issue:

    I want my footer fixed at the bottom so it is in place no matter which screen I am using or if I toggle the full screen mode

    It works in all the other browsers except IE7 (I do not have to support previous versions)

    HTML
    Code:
    <div id="wrapper">
           
            <div id="menu">
                <a href="information.html"  rel="shadowbox;height=500;width=650" title="INFORMATION" >
                    <img src="images/info.png" alt="information icon" />
                </a>
                <a href="images/bricks_of_destiny.jpg" rel="shadowbox[gallery]"  title="IMAGES" >
                    <img src="images/image.png" alt="image icon"  />
                </a>
                <a href="music_player.swf" title="MUSIC" rel="shadowbox;height=400;width=600" >
                    <img src="images/music.png" alt="music icon" />
                </a>
                <a href="#" title="MOVIES"><img src="images/television.png" alt="movies icon"  /></a>
                <a href="quotes.html" title="QUOTES" rel="shadowbox;height=300;width=650" >
                    <img src="images/male_user.png" alt="male user icon"  />
                </a>
                <a href="#" title="REFERENCES">
                    <img src="images/search_globe.png" alt="search globe icon"  />
                </a>
            </div>
            <a href="images/destiny_1.jpg" rel="shadowbox[gallery]" title="IMAGES"></a>
            <a href="images/destiny_carma_jewell.jpg" rel="shadowbox[gallery]" title="IMAGES"></a>
            <a href="images/destiny-joan-marie.jpg" rel="shadowbox[gallery]" title="IMAGES"></a>
            <a href="images/pursuing_destiny.jpg" rel="shadowbox[gallery]" title="IMAGES"></a>
            
            <div class="clear"></div>
            
            
            <div id="destiny">
                Discover more about the word <span class="strong">DESTINY </span>! Click one of the icon above!
                (F11  Toggle Full / Standard screen)
             </div>
            
             <div id="footer">
                <ul id="breadcrumbs">
                    <li>Disclaimer</li>
                    <li> | Icons by: <a href="http://dryicons.com/" rel="shadowbox">dryicons.com</a></li>
                    <li> | Website by: <a href="http://www.eezzyweb.com/" rel="shadowbox">eezzyweb</a></li>
                    <li> | <a href="http://jquery.com/" rel="shadowbox">jQuery</a></li>
                </ul>
            </div>
        </div>
    CSS

    Code:
    #wrapper{
    text-align:center;
    margin:0 auto;
    width:750px;
    height:430px;
    border:1px solid #fff;
    }
    #menu{
    position:relative;
    margin:0 auto;
    top:350px;
    width:450px;
    height:60px;
    }
    #destiny{
    position:relative;
    top:380px;
    color:#FFF;
    font-size:1.5em;
    font-weight:bold;
    border:1px solid #fff;
    }
    #breadcrumbs{
    list-style:none;
    }
    #breadcrumbs li{
    display:inline;
    color:#FFF;
    }
    #footer{
    position:absolute;
    width:750px;
    height:60px;
    margin:0 auto;
    text-align:center;
    border:1px solid #fff;
    bottom:0;
    }
    .clear{
        clear:both;
    }
    The white borders are there only for debugging purposes

    The application is hosted at http://www.eezzyweb.com/destiny/

    Any suggestion is appreciated

  • #2
    Regular Coder
    Join Date
    Apr 2008
    Posts
    685
    Thanks
    15
    Thanked 105 Times in 104 Posts
    Where does it sit in IE7?

    Maybe you need to set a min-height of 100% like:

    Code:
    html, body{ min-height:100%; }

  • #3
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Some help here. Use the Search box.

    also here.

    and here.

    Frank
    Last edited by effpeetee; 05-06-2010 at 10:11 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.


  •  

    Posting Permissions

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