使div的宽度适应其包含多个div的内容

Question

我有一个小问题。

实际上，我正在尝试使“内容”的宽度适应其中的多个div。 实际上，我正在尝试将此代码适应多个屏幕，无法指定特殊的宽度。 内联块根本不起作用。 我不知道为什么 我会将div内容居中在页面中间，并将类集中在div内容居中。 实际上是一个完美的中心。

有想法吗？

的HTML

<div id="content">
<div class="badges"></div>    
<div class="badges"></div>    
<div class="badges"></div>    
<div class="badges"></div>    
<div class="badges"></div>    
<div class="badges"></div>    
<div style="clear:both;"></div>       
</div>

的CSS

#content{
    display:inline-block;
}

.badges{
    width:220px;
    height:380px;
    float:left;
    background:red;
    margin:10px;
}

谢谢，巴斯蒂安

Answer 1

不要使用浮点数。

尝试这个：

#content {text-align: center;}
.badges {
    width: 220px;
    height: 380px;
    background: red;
    margin: 10px;
    display: inline-block;
}

这就是应该使用inline-block方式。

另外，请按照Kai Qing的说明修改标记。

Answer 2

对于一个，您应该使用实际的div关闭标签关闭div，而不要跨度。 然后也关闭该清除div