Question

我似乎无法找到明确的答案。在100％宽度的div中，我有三个或更多div，每个120px宽; div中div的数量是可变的，但我希望它们出现在包含div的中心，并从中间向外扩展，添加的越多。我想我可能只是将它们包装在标签中，但我宁愿用CSS方式来做它。有人可以提供一个很好的机制吗？

Answer 1

我认为你对纯CSS的要求太高了。 Here is what I came up with。但这不是你想要的。 #innerwrap需要一个可变宽度（auto会是最好的），但这会破坏其内容居中的规则。所以如果没有一些jQuery，我认为这是不可能的。

Answer 2

<style>
#container{
  border:1px solid blue;
  margin:0;
  padding:20px;
  text-align:center;
}
#container div{
  display:inline;

    padding:20px;
    border:1px solid red;
}
</style>
<body>
    <div id="container">
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div>5</div>
    </div>
</body>

Answer 3

怎么样：http://jsfiddle.net/jennyfofenny/eSR89/？

Answer 4

您可以使用display：inline-block作为居中的div。

在单个容器div中集中3个或更多div

4 个答案: