0

Possible Duplicate:
Center contents of webpage

I have followed the way to make webpage center aligned but the site still is left aligned. Please help out. Thanks

#parent{
      margin:0 auto;
      width: 960px;  
}
<div id="parent">
          <!--more code goes here-->
</div>
Community
  • 1
  • 1

1 Answers1

4

In some browsers you still have to put a text-align on the body to make it work:

body {
    text-align: center; /* this helps some browsers align the #parent element */
}

#parent{
    margin:0 auto;
    width: 960px; /* a fixed width is mandatory for margin auto to work */
    text-align: left; /* this resets the contents alignment */
}
Ricardo Souza
  • 16,030
  • 6
  • 37
  • 69
  • Got it aligned. Actually, I was using a different width for the body and a different one for parent. Removing the width for body made it work. If you can help me understand why would the width of body make such a problem occur, I would love to mark your answer as correct. Thanks –  Sep 29 '12 at 22:37
  • Actually, the body element is an element like all others. If you specify a width to it and don't apply the `margin: 0 auto;`, it will be left aligned and so, every content inside of it. – Ricardo Souza Sep 29 '12 at 22:39
  • Thanks. A little more help is needed. The center aligning has moved inside all of the child divs causing them to be misplaced. Can you help me out in specifying the trick to make it specific the the parent div only. Thanks –  Sep 29 '12 at 22:48
  • You just need to add the `text-align: left;` to the container. – Ricardo Souza Sep 30 '12 at 00:37