• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1043
  • Last Modified:

Freezing Header on Master Page

Greetings,

Another question ... (thanks to all those patient persons out there  :)  :)  )

I have a Master Page containing a table with 3 rows (Header, Contents, Footer). I would like the Header to remain fixed, even if the content is scrolled down to infinity!!.

HOW DO I DO THIS? IS IT POSSIBLE WITH TABLE/ROWS? OR MUST I USE ANOTHER ARROACHH?
0
allanmark
Asked:
allanmark
  • 2
  • 2
3 Solutions
 
McExpCommented:
If your happy with using AJAX you could use the AlwaysVisibleControl?

See here for more information:-

http://asp.net/AJAX/AjaxControlToolkit/Samples/AlwaysVisibleControl/AlwaysVisibleControl.aspx
0
 
McExpCommented:
Or you could use a frameset: -

http://www.w3schools.com/html/html_frames.asp
0
 
DiscoNovaCommented:
@McExp: Umm... swatting flies with a bazooka, are we? (speaking of using AJAX to fix contents on a page:)

<html>
      <head>
            <title>TEST</title>
            <style type="text/css">
                  html, body {
                        margin: 0;
                        padding: 0;
                  }
                  div#topfix0 {
                        background:#f00;
                        border-bottom: 3px double #800;
                        position: fixed;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 20px;
                  }
                  div#topfix1 {
                        width: 100%;
                        height: 25px;
                  }
            </style>
            <!--[if gte IE 5.5]>
            <style type="text/css">
                  div#topfix0 {
                        position: absolute;
                        left: expression((ieFixFoobar1=document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft)+"px");
                        top: expression((ieFixFoobar1=document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop)+"px");
                  }
            </style>
            <![endif]-->
      </head>
      <body>
            <div id="topfix0"><center>THIS SHOULD BE FIXED</center></div>
            <div id="topfix1">&nbsp;<!-- If this DIV-element is not present, content will go under the fixed "header" -->&nbsp;</div>
            <!-- The actual content starts here -->
            This is content<br>... add enough to get the page scrolling...
            <!-- The actual content ends here -->
      </body>
</html>
0
 
DiscoNovaCommented:
Oh yes, forgot to mention... the solution I've provided works quite nicely on and IE6 & IE7 (didn't have older ones to test, but it should basically work on IE5.5+), Firefox, Opera, Safari (on all officially supported platforms at least) and causes no noticeable trouble on other browsers either. There's no need for bazookas :)
0
 
allanmarkAuthor Commented:
Thank you for the answers!!!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now