CSS 父元素没有被撑开

Question

<div>
    <div class="fxxk"></div>
</div>
.fxxk{
    width: 2000px;
    height: 200px;
    background-color: green;
}

子元素宽度设置的很大，浏览器出现了横向滚动条，但发现父元素的宽度没有被撑到2000px，仅仅撑到了浏览器最大宽度。

但如果我在父元素上设置display:inline-block，就可以被撑到2000px了，什么原因呢？

Answer 1

块级元素被子元素撑开时，如果没设置宽度，宽度就是这个块级元素的父元素的100%，所以你的div的宽度是body的100%。当你.fxxk的宽度是10px时，你可以发现你外层的div的宽度还是body宽度