title: How to freeze header of the page
body: <p>My web template is based on div tags. I want to freeze header part (Header, logo etc), I mean when you scroll the page the header should be in fixed position.</p>
  
  <pre><code> &lt;!--Header and Logo --&gt;
   &lt;div id="outer"&gt;
   &lt;div id="header"&gt;
     &lt;h1&gt;&lt;a href="#"&gt;Some Application&lt;/a&gt;&lt;/h1&gt;
     &lt;img src="/media/images/logo.gif"  height="95" width="190"&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>Here is my css</p>
  
  <pre><code>#outer
  {
  
  }
  /* Header */
  #header
   {
  height: 95px;
  background-image: url();
  background-repeat:no-repeat;
  background-position: bottom left;
  padding-left: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
  }
  </code></pre>
  
  <p>Can some one help me? Thanks</p>