Footer help

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hello,

    absolutely positioned elements do escape page flow but they respect the parent container’s position if they have none declared.

    Try this:

    #site-generator {
position: absolute;
background-image: url('https://www.geimaku.com/wpcontent/uploads/2012/06/footer-bg.png');
width: 100%;
margin: auto;
left: 0;
}

    You’ll still have the horizontal scroll bar because padding is added to the box size, and your box is set to 100% width.
    You can fix this by using this code:

    #site-generator {
position: absolute;
background-image: url('https://www.geimaku.com/wpcontent/uploads/2012/06/footer-bg.png');
width: 100%;
margin: auto;
left: 0;
padding: 10px 0;
}

    If you wish the element to hover while the page scrolls, use fixed position instead, and set vertical position:

    #site-generator {
position: fixed;
background-image: url('https://www.geimaku.com/wpcontent/uploads/2012/06/footer-bg.png');
width: 100%;
margin: auto;
left: 0;
bottom: 0;
padding: 10px 0;
}

    Let me know if you run into any issues.

    Thread Starter makta112

    (@makta112)

    It worked!

    Thank you very much!

    Anytime ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Footer help’ is closed to new replies.