Box (rechts) schiebt sich unter andere Box (links

[Norman]

Ich habe einen Rahmen bzw. Box. In dieser habe ich zweiweitere  Boxen.

Wenn man die Seite zusammenschiebt, und der Inhalt der linken (left) Box nicht so groß (nach unten) ist wie die rechte (middle), dann schiebt sich die rechte (middle) unter die linke Box.
Wie kann ich das verhinden, das die eine Box sich unter die andere Boch schiebt.

.box{
margin:0 2% 20px 0;
padding:0 0 10px 0;
border-right: #787878 1px dotted;
border-bottom: #787878 1px dotted;
width:47%;
float:left;
}

.box .left{
width:100px;
float:left;
}

.box .middle{
width:10px;
margin:0 0 0 0;
}