The following examples show a div (green) with margin-top:50px. In all cases we expect it to be at least that far from previous block (blue).
Example 0
Float is display:none. The effective margin is 50px. Boxes 1 and 3 should never be closer than this.
from 1 to 3: 50px;
Example 1
float fits within the margin. it doesn't affect results of margin collapsing.
from 1 to 3: 50px;
Example 2
3.
margin-top:50px;
clear:left;
although box 3 has 'clear:left' there is enough space and clearance is not present
from 1 to 3: 50px;
Example 3
3.
margin-top:50px;
clear:left;
clearance is added to make box3 clear the float
from 1 to 2: 40px;
from 1 to 3: 60px;
Example 4
2 and 3 share the parent block container. margin of 3 should put the container 50px below 1. 3 is pushed further down by the float.
from 1 to 2: 50px;
from 1 to 3: 70px;
Example 5
3.
margin-top:50px;
clear:left;
3 has clear:left. it is under the float. before clearing the float margin of 3 is collapsed with parent container.
expect same result as ex.4
from 1 to 2: 50px;
from 1 to 3: 70px;
The above examples have expectations set based on reading of 9.5.2 as a two-step process of collapsing margins, then adding clearance as necessary. Margins are not re-collapsed after clearance is applied.