看到提问区有同学说这里只要触发BFC就能得到宽度，我试了下，发现应该不是BFC的原因。

而是因为ul默认是块标签，所以宽度是占据父元素100%的，不会被内容撑开，这里只要把ul的display设置成inline-block 或者设置浮动，就能让ul自适应内容宽度了。

如果是BFC的原因的话，ul设置overflow:hidden 照理说是触发BFC了，但是我试了发现并不会把宽度撑开。

希望老师指点一下我的想法对不对。

html:

<div>
      <ul>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
      </ul>
    </div>

css:

div {
  background: red;
  width: 100px;
  height: 50px;
  white-space: nowrap;
  overflow: hidden;
}

ul {
  padding: 0;
  margin: 0;
  list-style: none;
  /*float: left;
  display: inline-block;
  overflow: hidden;*/
}

li {
  display: inline-block
}

这个例子里float: left; 和 display: inline-block;只要设置一个就能从审查元素里看到ul的宽度超过外面的div，而只设置overflow:hidden则不行。