Charly: Block Formatting Context

Beitrag lesen

Hallo,
da mein Versuch mit float:left seltsame Effekte brachte:

aaaaa        xxxxxxx
bbbbb
ccccc
ddddd
eeeee
fffff
             zzzzzzz

Statt wie gewünscht:

aaaaa        xxxxxxx
bbbbb
ccccc        zzzzzzz
ddddd
eeeee
fffff
habe ich gesucht und vieles gefunden, davon das meiste für mich (Anfänger) unverständlich.
Hängen geblieben bin ich nun an diesem Dokument
und dem Beispiel

  
  
#container:after {  
   display: block;  
   clear: both;  
   content: ".";  
   height: 0;  
   visibility: hidden;  
}

Dann wird im Anschluss an dieses Beispiel hingewiesen auf
Nachteile der gängigen Praxis class="clearfix", nämlich:
Mit class="clearfix" werden wieder massenhaft präsentationsbezogene Informationen im HTML untergebracht.
Daher meine Fragen:
1. Wie verweise ich im HTML auf obiges CSS.
2. Gibt es inzwischen bessere Methoden, die die o.g. Nachteile nicht haben
3. Gibt es eine Dokumentation, die für Anfänger noch verständlicher ist (z.B mit vollständigen Beispielen)?