Results 1 to 5 of 5

Thread: Footer goes below browser window

  1. #1
    Join Date
    Nov 2009
    Posts
    43
    Thanks
    14
    Thanked 0 Times in 0 Posts

    Default Footer goes below browser window

    At the moment I'm working on my portfolio website.

    I have some issues I don't know how to fix and I thought maybe someone on here would know how to fix it

    Please check out my site: http://bit.ly/USkeJ3

    1: When I enter the portfolio, It looks like this. Why is the footer below the browser window? and how do I get the footer to fill the entire page width?
    Click image for larger version. 

Name:	01.jpg 
Views:	259 
Size:	5.2 KB 
ID:	4892

    2: This is when you click on a project and scroll down to the thumbnails. How do I prevent the footer from crashing with the thumbnails?
    Click image for larger version. 

Name:	02.jpg 
Views:	180 
Size:	16.8 KB 
ID:	4893

    CSS: http://bit.ly/VZ0LbS

    Any help is appreciated!

  2. #2
    Join Date
    Nov 2009
    Posts
    43
    Thanks
    14
    Thanked 0 Times in 0 Posts

    Default

    I actually want the footer to be below the browser window, but only when content above is pushing it down. Right now there are not many thumbnails on the site so I'm just wondering why this is happening...

  3. #3
    Join Date
    Jan 2013
    Location
    India
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi,

    I see that the footer is in "absolute" position. So, IMO, i suggest you to add padding-bottom: 100px to the #content_container.

    Best Regards

  4. #4
    Join Date
    Nov 2009
    Posts
    43
    Thanks
    14
    Thanked 0 Times in 0 Posts

    Default

    Hi,

    I tried that but it doesn't seem to work.

    Does anyone know what I need to do to fix it?

  5. #5
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,363
    Thanks
    31
    Thanked 139 Times in 134 Posts
    Blog Entries
    32

    Default

    If you are happy with a fixed footer, this will do it:
    <!-- You may change all styles in the footer div except 'position: fixed' and 'bottom: 0px' -->
    Code:
    <div id="footer" style="position: fixed; left: 0px; right: 0px; bottom:0px; background: darkred; color: white; text-align: center; font-family: verdana; font-size: 12px; ">I'm a footer<br>Yes I am</div>

Similar Threads

  1. Modal window veil does not cover browser window
    By carmelaem in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 11-19-2012, 07:27 PM
  2. Replies: 0
    Last Post: 12-18-2009, 09:40 PM
  3. Keep it in the browser window.
    By Samanello in forum JavaScript
    Replies: 5
    Last Post: 12-06-2008, 10:05 AM
  4. Browser window resizing
    By viktor in forum HTML
    Replies: 4
    Last Post: 08-13-2006, 04:09 AM
  5. Removing Browser Print Page Header/Footer
    By hsantos in forum JavaScript
    Replies: 1
    Last Post: 06-21-2006, 11:45 PM

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
  •