根据ul li元素扩展div高度？

Question

和平与祝福在你身上：）

说我有：

<div class="c1">
   <div class="c2">
      <ul>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
         <li><div class="c3"></div></li>
      </ul>
   </div>
</div>

所以基本上我想要div c1＆amp; c2根据li内容进行扩展。

我创建了这个Jsfiddle：https://jsfiddle.net/unpfk1aw/，它在c1扩展但c2保持不变。如果你告诉我原因是什么，我将非常感激。

Answer 1

因为您正在使用float: left;。这会将元素从文档流中取出，这意味着c2 div不知道每个li的高度。

相反，请在float: left;选择器中将display: inline-block;替换为ul li。