收缩/收缩 - 适合div在css中回流浮动的div

Question

http://jsfiddle.net/zEcn3/12/

我试图将一个div content调整大小调整为div符合一行的s 数.因此,当窗口大于所有item divs组合时,该示例工作正常,因此它们都在一行中,但是当窗口调整为较小,因此其中一个items被回流到下一行时,其content div宽度为100%而不是收缩包装.

我想要这个的原因是因为我可以使用内容上方的菜单栏集中内容,缩小到组合的重排内容的大小.

HTML:

<div class="wrapper">
    <div class="content">
        <div class="item">Hello.</div>
        <div class="item">Hello.</div>
        <div class="item">Hello.</div>
        <div class="item">Hello.</div>
        <div class="item">Hello.</div>
    </div>
</div>

CSS:

.item {
    float: left;
    width: 70px;
    border: 1px solid black;
}

.content {
    display: inline-block;
    border: 1px solid black;

}
.content:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

Answer 1

尝试使用margin:auto并container <div>设置fixed position.