The Infinite Loop – Beginner's SEO, Beginner C# & JQuery Tutorials Problem. Problem Solved. Loop. – The life of a programmer

18Jun/091

Centering a Div in IE

Little quick tip. This is mentioned in my basic css layout tutorial, however, im making a seperate blog post, because it is important. If you have a div and you want it centered, you may do this with margin: 0 auto, applying auto margin to left and right. This doesnt really work in IE.

If you are trying to center your container or wrapper div, this is how you do it.

Problem: IE doesn't properly center a wrapper or container div.
Reason: IE actually uses text-align to center block level items as well as text.
Solution: The solution is to apply text-align: center to the body tag, and offset this in the wrapper div.

<div id="wrapper">

</div>

And the css:
body{text-align: center; /*centers in IE*/}

#wrapper{
text-align: left; /*offset the ie center*/
margin: 0 auto; /*centers in other browsers*/
}

Enjoy.

Share and Enjoy:
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • Slashdot
  • StumbleUpon
  • Technorati
  • Yahoo! Buzz
Comments (1) Trackbacks (0)
  1. Finally, you helped me solve this goddamn problem! Thanks a lot. Please, have at look at my website. I will be happy to know your opinion on my artworks. Good luck.


Leave a comment

No trackbacks yet.