Warum klar: Richtig funktioniert nicht wie vorgesehen

Ich bin immer durcheinanderclear: left, clear: right undclear: both in CSS. Ich kenneclear: both bedeutet, dass keine schwebenden Elemente auf beiden Seiten von sich selbst zulässig sind.

Ich habe ein paar Tests gemachtHier. Ich dachte, das Layout würde wie folgt aussehen, weilB Verwendetclear: both. Aber das tut es nicht. Kann mir jemand sagen warum?

A
B
CD

Aktualisierte (Post den Code)

<div class="container">
    <div class="A">a</div>
    <div class="B">b</div>
    <div class="C">c</div>
    <div class="D">d</div>
    <div class="CB"></div>
</div>

.container{
    width:100%;
    border:1px solid red;    
}
.B{
    float:left;
    clear:both;
    width:10%;
    height:30px;
    border:1px solid blue;
}
.A,.C,.D{
    float:left;
    width:10%;
    height:30px;
    border:1px solid blue;
}
.CB{
    clear:both;
}

Antworten auf die Frage(2)

Ihre Antwort auf die Frage