Html 宽度未知的定心div

我有div

，它包含所有页面内容，包括页眉页脚等

所以我想把这个div放在我页面的中心，现在我有了这个css：

#page{
position:relative;
margin:auto;
width:1000px;
}

它可以工作，但我的问题是这个div中的内容不断变化，所以宽度也会变化，它可以是

1000px

或

10100px

，所以我需要像

width:auto，怎么能做那样的事情呢？
这个怎么样

body {
  text-align: center;
}
#container {
  text-align: left;
}

假设
一种方法是在
#页面
元素周围创建一个包装器，我们称之为
#包装器
：

#wrapper {
   position: relative;
   left: 50%;
   float: left;
}
#page {
   position: relative;
   left: -50%;
   float: left;
}

这将允许
#页面
div保持可变宽度。
这将为您提供一个尺寸适中的div，它位于主体的中心，是适合内容所需的最小尺寸：

body { text-align: center; }
div.container { display: inline-block; text-align: left; }

请参见：

HTML:

<div id="container">
    i'm as wide as my content
</div>

body {
    text-align: center;
}
#container {
    text-align: left;
    border: 1px solid red;
    display: inline-block;
    /* for ie6/7: */
    *display: inline;
    zoom: 1;
}

你的意思是：？@Michael我不认为他在居中方面有问题（在这种情况下混淆了标题）。如果你读了这个问题，他对内容的宽度有问题。你是在问如何水平居中一个宽度未知的元素吗？div是叫#page还是#container？是的，我可以毫无问题地居中，但为此我需要使用width:some with px；如果我的内容宽度比包含一些页面元素的容器大或小，就会变得混乱。谢谢。我刚刚编辑了你的JSFIDLE并删除了
#container
的所有样式，它仍然有效。我猜
正文
上的
文本对齐
会起作用吗？在firefox中测试。@codepooter:这样做意味着
#container
现在是全宽的，里面的文本居中。最佳解决方案