html - 将div居中放置在另一个div中

我有一个简单的布局，其中包含一个#container

#container {
    width: 775px;
    margin: 0 auto;
}

使其居中，最大宽度为775px

然后里面有另一个div，其宽度根据里面的内容而变化

.innerdiv { margin: 0 auto; }

我想要这样，如果.innerdiv小于775px，它将在该775px区域内居中。

问题是上述代码无法正常工作。我已经为此花了一些力气，但是无法弄清楚我需要做什么。

最佳答案

这样写：

#container {
    width: 775px;
    margin: 0 auto;
    text-align:center;
}
.innerdiv {
    display:inline-block;
    *display:inline /* IE */
    *zoom:1;/* IE */
    text-align:left;
}

检查一下

http://jsfiddle.net/efEgq/