Why clear: right doesn't work as intended

clear on an element only clears the floats before it in document order. It doesn't clear floats after it. The left and right values mean clearance of left floats and right floats preceding an element respectively. They don't mean clearing floats before and after the element.

Since C is being floated, but doesn't have any clearance being applied, it floats next to B. B does not try to clear C because C comes after it in the document structure.

Furthermore, clear: right doesn't have any effect in your test case because none of your elements are being floated to the right anyway.