<p>Header, footer and sidebars have fixed position. In the center a content area with both scroll bars. No outer scroll bars on the browser. I have a layout that works in IE7 and FF. I need to add IE6 support. How can I make this work?</p>
<p>Here is an approximation of my current CSS.</p>
<pre class="lang-html prettyprint-override"><code>    &lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
    &lt;html&gt;
    
    &lt;head&gt;
      &lt;title&gt;Layout&lt;/title&gt;
      &lt;style&gt;
        * {
          margin: 0px;
          padding: 0px;
          border: 0px;
        }
        
        .sample-border {
          border: 1px solid black;
        }
        
        #header {
          position: absolute;
          top: 0px;
          left: 0px;
          right: 0px;
          height: 60px;
        }
        
        #left-sidebar {
          position: absolute;
          top: 65px;
          left: 0px;
          width: 220px;
          bottom: 110px;
        }
        
        #right-sidebar {
          position: absolute;
          top: 65px;
          right: 0px;
          width: 200px;
          bottom: 110px;
        }
        
        #footer {
          position: absolute;
          bottom: 0px;
          left: 0px;
          right: 0px;
          height: 105px;
        }
        
        @media screen {
          #content {
            position: absolute;
            top: 65px;
            left: 225px;
            bottom: 110px;
            right: 205px;
            overflow: auto;
          }
          body #left-sidebar,
          body #right-sidebar,
          body #header,
          body #footer,
          body #content {
            position: fixed;
          }
        }
      &lt;/style&gt;
    &lt;/head&gt;
    
    &lt;body&gt;
      &lt;div id=&quot;header&quot; class=&quot;sample-border&quot;&gt;&lt;/div&gt;
      &lt;div id=&quot;left-sidebar&quot; class=&quot;sample-border&quot;&gt;&lt;/div&gt;
      &lt;div id=&quot;right-sidebar&quot; class=&quot;sample-border&quot;&gt;&lt;/div&gt;
      &lt;div id=&quot;content&quot; class=&quot;sample-border&quot;&gt;&lt;img src=&quot;/broken.gif&quot; style=&quot;display: block; width: 3000px; height: 3000px;&quot; /&gt;&lt;/div&gt;
      &lt;div id=&quot;footer&quot; class=&quot;sample-border&quot;&gt;&lt;/div&gt;
    &lt;/body&gt;
    
    &lt;/html&gt;
</code></pre>

[{'answer_id': 30360, 'author': 'ceejayoz', 'author_id': 1902010, 'author_profile': 'https://Stackoverflow.com/users/1902010', 'pm_score': 4, 'selected': True, 'text': '<p>Might be overkill for your project, but <a href="http://dean.edwards.name/IE7/" rel="noreferrer">Dean Edwards\' IE7 javascript adds support for fixed positioning to IE6</a>.</p>\n'}, {'answer_id': 30422, 'author': 'Cade', 'author_id': 565, 'author_profile': 'https://Stackoverflow.com/users/565', 'pm_score': 0, 'selected': False, 'text': '<p>Try IE7.js.  Should fix your problem without having to make any modifications.</p>\n\n<p>Link: <a href="http://code.google.com/p/ie7-js/" rel="nofollow noreferrer">IE7.js</a></p>\n'}, {'answer_id': 30932, 'author': 'palotasb', 'author_id': 3063, 'author_profile': 'https://Stackoverflow.com/users/3063', 'pm_score': 1, 'selected': False, 'text': '<p>Add the following code to the <code>&lt;head&gt;</code></p>\n\n<pre><code>&lt;!--[if lte IE 6]&gt;\n&lt;style type="text/css"&gt;\nhtml, body {\n    height: 100%;\n    overflow: auto;\n}\n.ie6fixed {\n    position: absolute;\n}\n&lt;/style&gt;\n&lt;![endif]--&gt;\n</code></pre>\n\n<p>Add the <code>ie6fixed</code> CSS class to whatever you want to be <code>position: fixed;</code></p>\n'}, {'answer_id': 34424, 'author': 'Mocky', 'author_id': 3211, 'author_profile': 'https://Stackoverflow.com/users/3211', 'pm_score': 0, 'selected': False, 'text': '<p>These answers were helpful and they did let me add a limited form of fixed positioning to IE6, however none of these fix the bug that breaks my layout in IE6 if I specify both a top and a bottom css property for my sidebars (which is the behavior I need). </p>\n\n<p>Since top and bottom can\'t be specified, I used top and height. The height property turned out to be very necessary. I used javascript to recalculate the height when the page loads and for any resize.</p>\n\n<p>Below is the code I added to my test case to get it to work. This could be much cleaner with jQuery.</p>\n\n<pre><code>&lt;!--[if lt IE 7]&gt;\n&lt;style&gt;\nbody&gt;div.ie6-autoheight {\n  height: 455px;\n}\nbody&gt;div.ie6-autowidth {\n  right: ;\n  width: 530px;\n}\n&lt;/style&gt;\n&lt;script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"&gt;&lt;/script&gt;\n&lt;script type="text/javascript"&gt;\n\nfunction fixLayout() {\n   if (document.documentElement.offsetWidth) {\n      var w = document.documentElement.offsetWidth - 450;\n      var h = document.documentElement.offsetHeight - 175;\n      var l = document.getElementById(\'left-sidebar\');\n      var r = document.getElementById(\'right-sidebar\');\n      var c = document.getElementById(\'content\');\n\n      c.style.width = w;\n      c.style.height = h;\n      l.style.height = h;\n      r.style.height = h;\n   }\n}\nwindow.onresize = fixLayout;\nfixLayout();\n&lt;/script&gt;\n&lt;![endif]--&gt;\n</code></pre>\n'}, {'answer_id': 866836, 'author': 'Community', 'author_id': -1, 'author_profile': 'https://Stackoverflow.com/users/-1', 'pm_score': 0, 'selected': False, 'text': '<p>check out the pure css hacks below... some require forcing it into quirks mode (I think that\'s the most robust) but all work really well:</p>\n\n<p><a href="http://ryanfait.com/resources/fixed-positioning-in-internet-explorer/" rel="nofollow noreferrer">http://ryanfait.com/resources/fixed-positioning-in-internet-explorer/</a>\n<a href="http://tagsoup.com/cookbook/css/fixed/" rel="nofollow noreferrer">http://tagsoup.com/cookbook/css/fixed/</a></p>\n\n<p>I\'ve used this to great effect, hope it helps!</p>\n'}]
['https://Stackoverflow.com/questions/30346', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/3211/']