I fail to see where my example fails when writing semantic markup. As far as I've ever been concerned, semantic markup is classifying text on a page correctly (by use of headers, paragraphs, lists, etc).
"clear:both;" isn't semantics, it's visual appeal, or aesthetics. It's used with browsers that are cpaable of handling html and css, and has no appearance to many mobile phones or text-based browsers, or cause any accessibility or useability concerns with the blind.
The whole point is to bring the next line to the bottom of the largest div, whether that is class 'a' or class 'b'. Also, the next element may not be a paragraph, it could be another div that's the beginning of a footer in most cases.
<style>.a { float: left; }.b { float: right; }.clear {clear:both;}</style><div class='a'> <ul> <li>Alpha</li> </ul></div><div class='b'> <h2>Beta</h2> <p>Paragraph</p></div><div class="clear"></div><h1>Header</h1><p>Paragraph</p>
