Clearing floats without extra markup

I was reading this page here: http://robertnyman.com/2007/04/12/how-to-clear-css-floats-without-extra-markup-different-te开发者_JAVA技巧chniques-explained/ about clearing floats without extra markup but it didn't mention something I thought you could do.

Am I right in my thinking that you can also clear a float by just not floating the last element?

So if you wanted to float 3 elements, you float the first two and don't float the last one.... the last one will still float but anything after won't?

If elements in a container are set to float they will screw up.

Because the parent doesn't know the height of the floated element in it (because it isn't in the flow of the document anymore)

http://jsfiddle.net/CkdY6/

The best you can do is set the parent element to overflow: hidden

http://jsfiddle.net/CkdY6/1/

But as someone recently pointed out to me it will screw up when you want to use CSS3 stuff like a drop shadow.

http://fordinteractive.com/2009/12/goodbye-overflow-clearing-hack/

Most CSS "reset" stylesheets will have a class for auto-clearing after an element. E.g. these rules from html5reset.org allow you to write <div class="clearfix">your floats in here</div>:

.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }