9.5.2 Controlling flow next to floats: the 'clear' property Change # Clearance is introduced as spacing above the margin-top of an element. # It is used to push the element vertically (typically downward), past # the float. to | Values other than 'none' potentially introduce clearance. | Clearance inhibits margin collapsing and acts as spacing above the | margin-top of an element. It is used to push the element vertically | past the float. and shift to after value definitions. Change # The clearance of the generated box is set to the amount necessary to # place the top border edge below the bottom outer edge of any to | Requires that the top border edge of the box be below the bottom | outer edge of any x3 Change # then its clearance must be set to the greater of: to | then clearance is introduced and must be set to the greater of: Change # The clearance can be negative. to | The clearance can be negative or zero. 8.3.1 Collapsing margins Change # An element that has had clearance applied to it never collapses to | An element that has clearance never collapses Change # When an element's own margins collapse, and that element has had # clearance applied to it to | When an element's own margins collapse, and that element has clearance Change last sentence of # Explanation: Without the 'clear', the first and last paragraphs' # margins would collapse and the last paragraph's top border edge # would be flush with the top of the floating paragraph. But the # 'clear' requires the top border edge to be below the float, i.e., # 2em lower. That means that the margins must not collapse and # clearance must be added such that clearance + margin-top = 2em, # i.e., clearance = 2em - margin-top = 2em - 3em = -1em. to | This means that clearance must be introduced. Accordingly, | the margins no longer collapse and the amount of clearance | is set so that clearance + margin-top = 2em, i.e., | clearance = 2em - margin-top = 2em - 3em = -1em.