Jump to content

Scrolling content below a fixed header.


justinbriggs1
 Share

Recommended Posts

You just make the portion you want scrollable to be overflow:auto, with some code to stop it from exceeding the height of the window.

  • Like 1
Link to comment
Share on other sites

Guest reshaba

Synook is right!.. You can place the static header in a table and place the content in a separate table with in a div. Fix the height & width of the div according to ur requirement. But never forget to set the style='overflow:auto;'

Link to comment
Share on other sites

Synook is right!.. You can place the static header in a table and place the content in a separate table with in a div. Fix the height & width of the div according to ur requirement. But never forget to set the style='overflow:auto;'
I would advise against the majority of that advice. Your suggestion of the use of tables in this situation is considered against best practices and is unsemantic. Tables should only be used for tabular data. Your suggestion for using the div could be part of the solution, just leave the tables out of it.btw, to the OP, I really like that header, especially how the icons at the top are "drawn" Edited by thescientist
Link to comment
Share on other sites

it shouldn't be that hard to implemement.HTML

<div id="header">  <img src="header.jpg" alt=""/></div><div id="content">  <p>scrollable content (add lots of it so it exceeds the div's height)</p></div>

CSS

#header{  height: 100px;}#content{  height: 200px;  overflow: auto;}

Edited by thescientist
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...