How to center a <div> element in IE6

Question

Hey,

trying to implement a dialog-box style behaviour using a separate div section with all the stuff inside it.

When the "dialog box" needs to be shown, it has to display at the center of the WINDOW, not in the center of the page, that is, REGARDLESS of the scroling position. Furthermore, the correct solution will not move the "dialog box" if the user scrolls the page.

In Chrome and FF this works using position='fixed' and centering the div in the intuitive way.

This does not seem to work in IE6 (apparently fixed is not supported there).

Any ideas?

Answer 1

http://home.tampabay.rr.com/bmerkey/examples/fake-position-fixed.html

Answer 2

Try the trick shown at http://www.cssplay.co.uk/layouts/fixed.html

Answer 3

If I were you I would do it using jQuery and I would suggest you try it out too. This should fir perfectly for jQuery based solution jQuery Version or try out

body {   font: 80% verdana, arial, helvetica, sans-serif;   text-align: center; /* for IE */  }  #container {   margin: 0 auto;   /* align for good browsers */   text-align: left; /* counter the body center */

     border: 2px solid #000;   width: 80%;  } ");`

Answer 4

http://blog.josh420.com/archives/2007/10/centering-an-element-on-the-page-with-javascript-cross-browser.aspx