Home/ Questions/Q 1022565
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T11:29:07+00:00

hi I’ve created a fixed navigation bar/header at the top of a page with

  • 0

hi I’ve created a fixed navigation bar/header at the top of a page with the content below. on all browsers, if i scroll on the page, the content goes under the fixed position nav bar EXCEPT for IE (no surprise there) How do i edit the CSS so this works?

<div class="navbar" style="width:100%; position:fixed; left: 3px; top: 0px; z-index:1;">
blah blah blah navigation
</div>

<div class="content">
whats up, im the content and im really long so i need to scroll
</div>

here is an example of the behavior that works in most browsers but not the IE’s of the world.

http://myivyleaguer.com/media/satcenter.html

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You are forcing IE into quirks mode because you haven’t declared a doctype (http://www.quirksmode.org/css/quirksmode.html).

    If you add this: 

     <!DOCTYPE html>

    to the very top of your HTML document then position:fixed will work as expected. That is the HTML5 doctype, short and gets the job done.

    In order to get the fixed position to work in IE6 as well, you’ll need to add this to your stylesheet (I’m assuming the inline stuff is just for your testing): 

    * html .navbar { position: absolute; }

    See this page (http://ryanfait.com/position-fixed-ie6/) for an explanation.

    • 0