http://home.insightbb.com/~spiehler/intranet/template.asp I have an example page above so you can see what is happening. There really isn't anything fancy here just some CSS expressions to make IE work as if it supported position:fixed like firefox does. When the browser is in fullscreen, the header/footer fills the whole width of the screen. When you resize the browser and shrink it enough to make the bottom scrollbar appear the header/footer are still 100% width of the VISIBLE screen. But when you actually scroll the page to the right the header/footer width doesn't scale and you just see transparent space looking at the bgcolor of the body. Firefox doesn't do this, only IE. Now if I set a fixed width like 1250 px of course it doesn't do it but that would not be very friendly to viewers of different screen resolutions. Can anyone tell me how to get my headers in IE to scale properly when scrolling to the right? <html> <head> <title>Add Page Title</title> <input type="hidden" id="depth" name="depth" value="0"> <style type="text/css"> body { margin-top:0px; margin-left:0px; min-width:700px; margin-right:0px; background-color:cccccc; } div.content p { margin-top:0; } div.header { width:100%; height:50px; position:fixed; top:0px; left:0px; right:0px; bottom:auto; z-index:1001; background-color:teal; } span.ptitle{ position:relative; font-weight:bold; font-size:20pt; top:5px; left:10px; font-family:Trebuchet MS, sans-serif; border:solid white 0px; display:block; color:black; } div.navbar { width: 183px; background-color:white; border: solid 0px black; font-family:trebuchet ms, sans-serif; font-size:12pt; font-weight:bold; float:left; margin-right:-200px; margin-top:52px; margin-bottom:43px; margin-left:2px; } div.content { background-color:white; position:relative; width:75%; left: 191px; top:52px; min-height:690px; margin-bottom:97px; font-size:14pt; } div.footer { height:40px; background-color:teal; position:fixed; top:auto; left:0; right:0; bottom:0; width:100%; z-index:1001; } div.qlinkbuttons { top:5px; left:5px; position:relative; } </style> <!--[if IE]> <style type="text/css"> html, body{ /* fixed background image prevent jagged scrolling on the fixed position divs */ background:cccccc url('foo') fixed; padding: 0; margin: 0; overflow:auto; } div.header { position:absolute; /* making IE act like it can do position:fixed */ top:expression(eval(document.body.scrollTop)); } div.navbar { /* fixes IE pushing the content div down below the navbar when you resize the window */ margin-bottom:expression(-this.offsetHeight - this.clientHeight); } div.content { /* IE version of CSS min-width */ width:expression(document.body.clientWidth < 801? "800px": "75%" ); } div.footer { position:absolute; /* making IE act like it can do position:fixed */ top:expression(document.body.scrollTop+(document.body.clientHeight-this.clientHeight)); } </style> <![endif]--> </head> <body> <div id="header" class="header"> <span id="ptitle" class="ptitle"> Add Page Title Here </span> </div> <!-- begin navbar --> <div id="navbar" class="navbar" name="navbar"> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> <p>Nav Bar</p> </div><!-- end navbar --> <div id="content" class="content"> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> <p>content here</p> </div> <div id="footer" class="footer"> <div id="qlinkbuttons" class="qlinkbuttons"> <input type="button" value='Expand All' > <input type="button" value="Hide All" > <input type="button" value="Add to Quicklinks" > <input type="button" value="Edit Quicklinks" > </div> </div> </body> </html> HTML: