[thelist] Send footer to bottom of screen

[Means, Eric D]

> I've been doing so much back end coding lately that I am getting rusty
> on basic HTML and CSS.  Is there a way to send my footer snugly to the
> bottom of the page?  The content, at some screen settings,
> does not fill
> the entire screen, in which case I'd like the footer to sit
> right at the
> bottom of the browser.

You can put the footer inside a div, and set the attributes for that DIV as
follows:
div#footer {
  position: fixed;
  bottom: 0px;
}

Since for media="screen", "fixed" means "fixed with respect to the
viewport", the footer will always hover at the bottom of the screen -- even
if the content extends below the bottom of the screen.  You may need to
fiddle with margin-bottom on whatever content is above the footer in order
to make sure it doesn't end up hiding behind the footer.

Obviously this won't work if you want the footer to be at the bottom of the
screen unless the document is longer than the screen.

The only caveat is that many browsers (notably IE on Windows) don't
implement position: fixed correctly, so while the above will work in Mozilla
and Opera (and any other 100% CSS compatible browser) it won't work in the
most popular browsers.  :(