Help - Search - Members - Calendar
Full Version: Fixed Header Problem
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
Delirium Tremens
What I want to do is have a fixed header that includes my navigation for the page. I want my navigation to point all my subsequent pages below this header. I was going to use an iFrame but that is going to give me an unwanted scrollbar. I am at a loss as to how I can accomplish this without using javascript or php or some other language I am not yet familiar with. I fear that this may not be possible, but it never hurts to ask.

http://www.umsl.edu/~jeszqd/test/

That is my page, and the header should be fairly obvious. I want my content displayed below the header. Currently I have an iFrame set there but as soon as I add more content it is going to bungle the whole operation with that scrollbar I don't want!

If I need to clarify something, let me know.


Delirium
Darin McGrew
Please see the FAQ entry How do I include one file in another?
pandy
Or just put the header in every page. It will look the same and be just as fast.
Delirium Tremens
Thanks for the options, I'll have to think it out.
Delirium Tremens
So I put the header/footer on each page, now my problem lies in the content scrolling above my fixed header. It stays below the footer just fine, and they both carry the same attributes, so I don't understand why one stays on top while the other doesn't.

CODE
#header {
position: fixed;
width: 100%;
height: 200px;
top: 0;
left: 0;
background-image: url(header.png);
}
Delirium Tremens
I learned that IE has a real heck of a time dealing with fixed positions, so I abandoned that idea. Thanks for the help though!
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2010 Invision Power Services, Inc.