Why does setting overflow alter layout of child elements?

前端 未结 2 1448
执念已碎
执念已碎 2020-12-19 04:56

In this question someone was having a layout problem because they had two floated divs inside a non-floated div. I suggested adding float: left to their outer

2条回答
  •  爱一瞬间的悲伤
    2020-12-19 05:28

    Floating items removes them from the normal layout in many cases. It's not exactly like or unlike position: absolute; in that. Block items tend to ignore floated items (including block items that contain the item), but unlike position: absolute; items, floated ones are recognized and wrapped around by inline items, like text.

    Having the wrapping item (div or otherwise) also be floated causes it to behave differently related to floated items it contains. Having the wrapping item set to overflow: hidden; forces it to consider the items it contains differently, as well. My guess is it's just a happy coincidence that the end result here appears to be the same. Not a quirk or bug... just how it works out.

提交回复
热议问题