css - 3 div を並べて表示

Question

完全な長さが 150% の 3 つの div がありますが、それらを 1 行に収めることができません: これが私の html です:

<div class="clearfix">
<div class="left" id="w1">TEST</div>
<div class="left" id="w2">TEST</div>
<div class="left" id="w3">TEST</div>
</div>

そして私のCSS：

html,body { height:100%;width:auto;}

.left {
float: left;

}
  #w1 {width:20%;
 background-color:#009;
  }
#w2{width:100%;
  background-color:#9F3;
 }
#w3{ width:30%;
background-color:#30C;}

フィドルの完全なコードは次のとおりです。http://jsfiddle.net/sZwXN/1/ 彼のほかに、各パネルの高さが 100% であるとよいでしょう。