WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Footer trouble with neonglow (3 posts)

  1. Mikado_tee
    Member
    Posted 6 years ago #

    Hello all,

    I use the theme neongrow on the site I am working on. The footer is at the bottom of the page.
    But when I need to scroll the footer don't stay below the content, it ends in the middle of the browser window.

    I have tried with position:relative in content, and positon: fixed for footer, but then the content ends up in Explorer to the right. But works in Firefox.

    So...HELP!

    I figured out it problem is in the layout css:

    #wrapper{
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: left;outline:none
    font: normal 1.2em Verdana, Arial;
    }
    
    #header{
    float: left;
    margin: 1em 2% 0 2%;
    padding: 0 0 0 5% ;
    width: 91%;
    height: 140px;
    text-align: left;
    text-decoration: none; outline:none;
    color: #000000;
    border-bottom: 3px solid #004466;
    }
    
    #content{
    float: left;
    clear: both;
    position: absolute;
    width: 70%; height: auto;
    margin: 125px 0 0 1%;
    padding: 0 3% 0 1%;}
    
    .sidebar{
    float: right;
    width: 20%;
    margin: 1% 1% 0 1%;
    /* fix IE margin bug */
    display: inline;
    }
    
    #footer{
    position: fixed;
    bottom: 0px;
    clear: both;
    float: left;
    width: 100%;
    margin: 0%;
    padding: 10px;
    text-align: center;
    background: #ffffff;
    border-top: 3px solid #004466;
    }
    
    #logo {
    position: absolute;
    top: 25px;
    right: 70px;   }
  2. rogeriomello
    Member
    Posted 5 years ago #

    Have you tried using "position: absolute" instead of fixed on the footer?
    It might work... ;^)

    Good luck... 8^)

  3. Mikado_tee
    Member
    Posted 5 years ago #

    Hello,

    No help here, so I used all my brainpower and found this soloution:

    #wrapper{
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: left; outline:none;
    font: normal 1.2em Verdana, Arial;
    }
    
    #header{
    position:relative;
    float: left;
    margin: 1em 2% 0 2%;
    width: 91%;
    height: 110px;
    text-decoration: none;
    color: #000000;
    border-bottom: 31px solid #004466;
    }
    
    #content{
    float: left;
    width: 80%;
    margin: 5px;
    padding: 10px;}
    
    .sidebar{
    float: right;
    width: auto;
    margin:2% 1% 5% 0;
    /* fix IE margin bug */
    display: inline;
    }
    
    #logo {
    float:right;
    top: 25px;
    right: 70px;   }
    
    #footer{
    clear: both;
    width: 98%;
    margin: 5% 0 0 0;
    padding-top: 15px;
    border-top: 3px solid #004466;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic