使div宽度随内容增加

Question

我有2个div，一个在另一个之下。这些嵌套在另一个div中

<div id="site-wrapper">
 <div id="user1"><div>
 <div id="footer"></div>
</div>

CSS就是

#site-wrapper{
    border: 1px solid;
    width: 1000px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}

我们如何调整user1和footer，以便当user1的内容扩展时，site-wrapper会自动扩展

Answer 1

问题在于您将包装器的高度明确设置为100％。

删除该属性，您将看到您所描述的内容。

Answer 2

不要在site-wrapper中使用width，而是使用min-width

使用overflow：隐藏在site-wrapper中，它应该展开

Answer 3

将height: %的参数更改为height: px。这将根据需要扩展！

Answer 4

我已经为此苦苦挣扎了一段时间。 但这对我来说非常有效。 试试：

#user1 { 
    width: fit-content;
}