http://jsfiddle.net/zEcn3/12/
我试图获得一个div内容,调整大小适合一行的div数量。因此,当窗口大于所有项目div的组合时,该示例工作正常,因此它们全部在一行中,但是当窗口调整大小时,其中一个项目将回填到下一行,内容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; }