Html 使用float:left属性并排浮动两个div是否需要宽度？

当我第一次学习HTML时，有人告诉我，如果要使用

float:left

并排浮动两个div，必须在这两个元素上设置宽度。这是因为div在默认情况下是一个块元素，它将占用其可用的全部宽度

在我构建各种项目时，我遇到过这样的情况，浮动在没有设置宽度的情况下不起作用，但在其他情况下，似乎不需要宽度，并且浮动本身会限制元素的宽度

例如，下面显示两个元素并排浮动，仅使用float属性，不需要宽度

<style>
    .left{
        background-color:yellow;
        float:left;
    }

    .right{
        background-color:green;
        float:left;
    }
</style>

<div class="left">
    Floating left
</div>
<div class="right">
    Floating left
</div>

.左{
背景颜色：黄色；
浮动：左；
}
.对{
背景颜色：绿色；
浮动：左；
}
左漂
左漂

然而，在我现在似乎无法重现的其他类似场景中，将float属性应用于两个

div

不允许它们并排浮动，除非两个div都设置了宽度

---

我是不是疯了，或者这种行为在某些情况下会有所不同？

当在元素上设置

float:left

或

float:right

时，它会强制创建一个新的，其行为类似于内联块级别，宽度和高度是动态的（由内容决定）

。。。一个块元素，它将占据其可用的全部宽度 它

正常流量中未替换的块元件将占据其可用的全宽度。这项要求载于

浮动元素不在正常流中，因此该规则不适用。相反，浮动宽度是根据其自身的规则确定的，如中所述。这意味着，当浮动元素的计算宽度为“自动”时，其使用的宽度将使用“收缩到拟合”算法确定

请注意，收缩到拟合算法也用于其他类型的布局，包括未替换的内联块元素和表格单元格，但在其他方面，如垂直对齐，这些元素的布局行为与浮动的布局行为大不相同