It's just a bug. You can put another div around the outside and use that to center it, or turn the centered div into a single-celled table for the skin and simply align=center the table, or put the central div into a single celled table that surrounds everything and use the cell alignment to keep it in the middle. The advantage of this last method is that you can also center it vertically if needed. One hassle with the centered div-only layout is that your action menus are going to end up being off-set and you'll need to convert your containers to use dropdown actions instead. The table is the most reliable method. It's all a bit of a pain really, but it can be done.

Rob

You should use:

body
{}{
   text-align:center;
}

#wrappter
{}{
   width:720px;
   margin: 0 auto;
   text-align: left;
}