DIVs & Frames

[Subfusion]

I'm looking for a tutorial or guide that can explain me how I can make a DIV act like a frame, do any of you know of one?

My website is divided into two parts, the content and the footer. I want the footer to act like a frame, that is, it's always displayed, but I don't want the footer to overlap the content.

Thanks

[Dan Schulz]

You're saying you want the footer to always display at the bottom of the page?

Assuming you have your page broken down into two sections (content, which I will assume is a <div> with an ID attribute of "content" and a <div> with an ID attribute of "footer"), just set a style rule declaring the footer's position to be fixed (plus a height for the footer), and then add a bottom margin to the content div.

Like this:

<div id="content">
  (page content goes here)
  </div>
  <div id="footer">
  (footer content goes here)
  </div>

In your style sheet, add the following:

#content {
  margin-bottom: 5em;
  }
  #footer {
   height: 5em;
  position: fixed;
  bottom: 0;
  left: 0;
  }

Keep in mind though, that fixed positioning will not work in Internet Explorer (however, and please do not quote me on this, I think it works in Internet Explorer 7 Beta 2).

[thndrcloud]

If the content is longer than the viewport you still want the footer to appear at the bottom of the page but you want the content div to scroll? If that's correct then you should be able to do a modified version of Paul O'Brien's "footer at the bottom" tutorial found at http://www.sitepoint.com/forums/show...66&postcount=3.

The difference is that you won't set the height of the wrapper div (which would be your content div) to auto (or anything at all), instead you'll set overflow to scroll.

HTH

[Subfusion]

Thats what I currently have setup, I never thought about the footer on the content. Thanks!