居中包含浮动 div 的 div答案

【问题标题】：Center a div which containts floating divs居中包含浮动 div 的 div
【发布时间】：2013-04-08 22:29:16
【问题描述】：

我有这个代码：

<div id="cuerpo">
<?php foreach ($sistemas as $cada) { ?>
    <div id="show">
        <a href="<?php echo "index.php?zona=acceso&id=" . $cada['id']; ?>" target="_self"><?php echo $cada['nombre']; ?></a>
        <p><?php echo $cada['descripcion']; ?></p>
    </div>
<?php } ?>
</div>

所以我有一个 ID 为 "cuerpo" 的 div，它将模拟一个包含所有 $sistemas 的框，每个 div 称为 "show"。

然后，我有这个 css：

#cuerpo
{
width: 800px;
margin: 0 auto;
margin-top: 25px;
padding-bottom: 5px;
border: solid 2px black;
}
#show
{
width: 200px;
margin-top: 10px;
margin-left: 5px;
border: solid 1px black;
padding: 5px;
}

如果我使用float: left;，我网页中的所有内容都将被取消配置并且非常糟糕。

我想要这样的东西：

PS：我的 scheme 中的所有东西都在工作，但浮动的东西却没有。

感谢您的帮助！

EDIT1：

我根据接受的答案发布了一张带有我实际问题的图片。

【问题讨论】：

标签： css html css-float center

【解决方案1】：

只需将display:inline-block 用于您的#show 容器。请参阅此处的示例：http://jsfiddle.net/GLp3Y/

_________________*编辑*_______ em>_________

如果需要使用float，则必须将父容器设置为overflow:hidden。在此处查看演示：http://jsfiddle.net/GLp3Y/4/

【讨论】：

感谢您抽出宝贵时间@otinanai，检查此链接：jsfiddle.net/GLp3Y/2 即将解决？，我的意思是如果其他show 的长描述将显示在底部而不是顶部。
不幸的是，我在使用最后一个解决方案时遇到了问题@otinanai，如果您仍然可以帮助我，我发布了我的问题的编辑。

【解决方案2】：

你试过了吗

#cuerpo{
margin-left : 10%
margin-right : 10%}

它将居中

或者你可以把它放在一个 div 中，使这个 div 全宽并使用 text-align:center 和 div 和 display:inline 在 cuerpo 上

【讨论】：

我的问题是，如果我没有任何floating div，#cuerpo 将居中，但当我浮动#show 等...一切都扯掉了
第一个解决方案？那么，您想要浮动 div 内的浮动 div 吗？实际上，我没有看到问题，如果你使用 float，它会在父 div 内部浮动，这里是 cuerpo，所以无论 cuerpo 在哪里
@otinanai 解决方案是完美的解决方案，您可以查看他的链接，感谢您的宝贵时间。