Footer info not directly at bottom of page

  • Unknown's avatar

    Hi Folks,

    I have a question, hopefully someone can help me with (please)!

    My footer information (“206 DJ Co” & “Blog at WordPress”) appears at the bottom of the page (where I like it) when I use my home monitor. But, when I use a different computer/monitor…it appears just directly below the picture on my homepage.

    Can someone please help me with this? Thank you!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Your footer info appears at a fixed distance below the end of the content of each page. So its distance from the bottom of the browser window depends on a) screen resolution and shape, b) length of content. You can use CSS to make it show near the bottom of the browser window no matter what the monitor, but then it will overlap the content on the “Contact” page.

  • Unknown's avatar

    Hello, justpi!

    Thanks for your response. I appreciate it!

    On my other pages, such as “contact” the footer information-for the most part directly appears on the bottom. Why is it in the case, on the home page in particular, it does not behave the same way?

    And what do you mean it will overlap the “Contact” page?

    Thank you justpi!

  • Unknown's avatar

    You’re welcome.

    As I said, the footer info shows at a fixed distance below the end of the content. The content of your homepage is shorter than the content of the other pages, so on your homepage the footer shows higher.

    You could use CSS editing to say: display the footer near the bottom of the browser window. But on most monitors the content of the Contact page is longer than the browser window (you need to scroll down to see the end of the content), so if you said display the footer near the bottom of the browser window, the footer would show in front of the content rather than below it.

    So the only compromise I can think of is move the footer lower on the home page only. If that’s what you’d like, add this and change the value to adjust the distance:

    .home #colophon {
    margin-top: 40px;
    }
  • Unknown's avatar

    I see…you, are a genius.

    Thank you so much. Can I nominate you for a WordPress forum award or something (seriously).

    Cheers!

  • The topic ‘Footer info not directly at bottom of page’ is closed to new replies.