display: inline-block
is used in a number of clearfixes (1, 2), though none of those articles explain why it makes an element clear after itself. Why is it so?<
Inline-block elements establish new block formatting contexts for their contents. A block formatting context root always tries to contain its floats if sized automatically; see section 10.6.7 of the spec:
In addition, if the element has any floating descendants whose bottom margin edge is below the element's bottom content edge, then the height is increased to include those edges.
This is what makes an inline block able to contain its floats; no clearance is actually involved since no clearing element is introduced after the floating children.