> Clover's scripts do a great deal of help, but exactly the fixed.js,
> which is the one we need, won't work in IE/mac.

Well, no, it won't, but then that's because IE/Mac already
supports 'position: fixed'! :-) (albeit with an annoying bug about
hovers not working).

Fixed positioning will always put the element at the bottom of the
viewport, though, which is not quite what ecd wanted, which was
to statically position the footer just below the content, or at the
bottom of the viewport only if the content is shorter than the

This is not possible to do in pure CSS2 as the spec does not
properly define the height of the Initial Containing Block. However
if you assume the ICB to be as high as the viewport (as it will
probably be in CSS 2.1, and is in IE/Win, Mozilla and Opera,
but not IE/Mac or Konqueror), you can use a float-and-clear
to ensure the footer is underneath at least the height of the
viewport, and then move it up a bit using positioning... here
is some example code you can play with:

  html, body { height: 100%; margin: 0; padding: 0; }
  #height { float: left; width: 1px; height: 100%; }
  #content { padding-bottom: 60px; }
  #bottom {
    clear: left; position: relative;
    left: 0; width: 100%;
  #footer {
    position: absolute;
    left: 0; width: 100%;
    top: -60px; height: 60px;
    background: red;

  <div id="height"></div>
  <div id="content">
    Lorem ipsum dolor sit amet...
  <div id="bottom"><div id="footer">
    I am a 60px high footer.